在angularjs中填充下拉选择答案

【问题标题】：populate dropdown selects in angularjs在angularjs中填充下拉选择
【发布时间】：2015-12-19 02:05:14
【问题描述】：

我正在开发我的应用程序，我希望下拉值自动与日期选择器中的选定日期具有相同的值。我正在使用 angularjs，但我找不到足够的资源来专门回答我的问题。谢谢

这里有一些代码。我的整个代码都在 plunker 上

    script type="text/ng-template" id="custom-datepicker.html">
    <div class="form-inline enhanced-datepicker">
        <label>
            <input
                type="text"
                id="{{id}}"
                name="{{name}}"
                ng-model="ngModel"
                datepicker-popup="{{popup}}"
                datepicker-options="{{options}}"
                date-disabled="{{dateDisabled}}"
                min="{{min}}"
                max="{{max}}"
                open="opened"
                ng-pattern="/^(?:[1-9]|1\d|2\d|3[0-1]) (?:jan|feb|mar|apr|may|jun|jul|aug|sep|oct|nov|dec) (?:1|2)(?:\d{3})$/gim"/>

        <span class="input-group-btn">
                <button class="btn btn-default" ng-click="open($event)"><i class="glyphicon glyphicon-calendar"></i></button>
              </span>

        </label>
    </div>
                </script>
      <script>

  angular
    .module('App',['ui.bootstrap'])
    .directive('customDatepicker',function($compile,$timeout){
        return {
            replace:true,
            templateUrl:'custom-datepicker.html',
            scope: {
                ngModel: '=',
                dateOptions: '@',
                dateDisabled: '@',
                opened: '=',
                min: '@',
                max: '@',
                popup: '@',
                options: '@',
                name: '@',
                id: '@'
            },
            link: function($scope, $element, $attrs, $controller){

            }    
        };
    })

这里是 plunker 链接：http://plnkr.co/edit/4XRjszIATgvUVrofgRFI?p=preview

【问题讨论】：

标签： javascript jquery angularjs datepicker dropdown

【解决方案1】：

据我所见，您的 plunker 现在正在工作，但不正常，因为例如在月份下拉列表中，将添加一个新值，因此您将有两个 Dec 值，而日期下拉列表不可点击。问题是，您是否需要它们可点击，如果需要，下拉菜单上的日期选择器日期更新是否应该更改？我会尝试将选择绑定到一个范围变量，该变量将在 datepicker 更改时解析为正确的日、月和年值。我想在您的 plunker 中向您展示，但所有内容都在 html 文件中，抱歉...

【讨论】：

是的@min che 这就是我想要的，但我不知道如何绑定这些值。我是 Angular 新手，但仍然没有足够的知识来使用它
好吧，我会为日、月和年的下拉菜单添加范围变量，以及从这些下拉菜单中形成日期值并更新日期选择器的函数。在 html 中，该函数将作为 ng-change 属性添加到每个选择中。然后，我将添加第二个函数，它将日期值解析为单独的日、月和年值，并将它们分配给上述范围值。同样，它将在 ng-change 属性中调用，但在 datepicker 中。如果需要进一步解释，请告诉我。
只是指出一个可能的无限循环，如果一个应该更新第二个，第二个应该更新第一个。

【解决方案2】：

您是否考虑过在选择日期时使用 ng-change 来调用函数来更新日期字段？

【讨论】：

是的，但我不知道应该在哪里放置 ng-change 和我应该调用的属性:( @Nichole Boseman