如何用角材质从按钮中触发选择?

时间:2022-07-21 19:46:48

I have an <md-select> that displays a list of years. Great. When the screen reaches a certain width, i change the select to a <md-button>

我有一个 ,它显示一个年份列表。太好了。当屏幕达到一定宽度时,我将select更改为

I would like to listen to the button click and trigger the select to "open" for lack of better words. Or, is there a different method I should use?

我想听一下按钮点击,并触发选择“打开”,因为没有更好的词。或者,我应该使用不同的方法吗?

Here is what I have - big surprise It's probably not what I should be doing. I understand this is a mobile framework - reasons beyond my control I am using it for my entire site. Thank you for any suggestions!

这是我所拥有的——令人惊讶的是,这可能不是我应该做的。我理解这是一个移动的框架——我无法控制的原因,我在整个网站使用它。谢谢您的建议!

<!-- Mobile year begin -->
<md-input-container hide show-xs>
    <md-button aria-label="Select a year" class="md-icon-button" ng-click="">
        <i class="material-icons">date_range</i>
    </md-button>
</md-input-container>
<!-- Mobile year end -->

<!-- Desktop year begin -->
<md-input-container hide show-gt-xs>
    <label>Year</label>
    <md-select ng-model="myModel" class="md-no-underline md-body-1">
        <md-option ng-repeat="option in $ctrl.myYears" ng-value="option.year">
            {{ option.year }}
        </md-option>
    </md-select>
</md-input-container>
<!-- Desktop year end -->

This is my component.js file:

这是我的组件。js文件:

'use strict';

angular.module('year')
    .component('year', {
        templateUrl: 'path/to/template/my-template.template.html',
        controller: function myController() {
            /**
             * Year data.
             *
             * @type {*[]}
             */
            this.years = [
            {
                year: 2017
            },
            {
                year: 2016
            },
            {
                year: 2015
            },
            {
                year: 2014
            },
            {
                year: 2013
            }
        ];
    }
});

1 个解决方案

#1


2  

I'd probably use a menu, and set the select model to match. Any change in the menu should update the select, and vice-versa.

我可能会使用一个菜单,并设置选择模型以匹配。菜单中的任何更改都应该更新select,反之亦然。

#1


2  

I'd probably use a menu, and set the select model to match. Any change in the menu should update the select, and vice-versa.

我可能会使用一个菜单,并设置选择模型以匹配。菜单中的任何更改都应该更新select,反之亦然。