Question

我正在尝试为AngularJS 1.4.4中的下拉控件创建自定义指令。我可以处理选定的事件，但我无法获得下拉列表中所选内容的绑定。

我想通过以下方式从Html标记中调用它。

<my-dropdown-list source="myList" destination="mySelection"  />

angular js custom指令就在这里。

(function() {

var directive = function($compile) {
    return {
        restrict: 'E',
        scope: {
            model: '=source',
            selectedValues: '=destination'
        },
        controller: function($scope) {

            $scope.onSelChange = function() {
                alert('called');
                console.log($scope.selectedItem.Code, $scope.selectedItem.Name);
            };
           // $scope.selectedItem is always undefined here.


        },
        link: function ($scope, $elem) {

            var rowHtml =
            '<select ng-options="item as item.Name for item in model" ng-model="selectedItem" ng-change="onSelChange()"></select>';

            $elem.html(rowHtml);
            $compile($elem.contents())($scope.$new());
        }
    };
};
my.directive('myDropdownList', directive);
})();

我是Angular的新手，所以这可能是我在这里错过的小事，但我似乎无法获得'selectedItem'的价值

Answer 1

我在AgularJS文档中找到了这个

请注意，没有ngOptions的select指令的值是总是一个字符串。当模型需要绑定到非字符串时值，您必须使用指令明确地转换它（请参阅示例如下）或使用ngOptions指定选项集。这是因为选项元素只能绑定到字符串值本。

链接：https://docs.angularjs.org/api/ng/directive/select

您应该使用ngRepeat生成此帖子的列表： Angularjs: select not updating when ng-model is updated

自定义指令：下拉选定值不绑定

1 个答案: