监听 Angular ui 选择的 on-select 事件答案

【问题标题】：listening to on-select event of angularj ui select监听 Angular ui 选择的 on-select 事件
【发布时间】：2015-10-20 03:24:28
【问题描述】：

我正在创建一个自定义属性，它将角度 ui 选择数据发送到服务器。但是，在我的自定义指令中，我需要绑定到 on-select 事件来实现这一点。

这是我的指令的 html 代码：

 <div class="component">
        <ui-select send-data ng-model="country.selected" theme="select2" ng-disabled="disabled" style="width: 300px;">
            <ui-select-match placeholder="Select or search a country in the list...">{{$select.selected.name}}</ui-select-match>
            <ui-select-choices repeat="country in countries | filter: $select.search">
                <span ng-bind-html="country.name | html"></span>
                <small ng-bind-html="country.code | html"></small>
            </ui-select-choices>
        </ui-select>
    </div>

请注意，该指令正在使用自定义指令send-data。这是我的指令：

var app = angular.module('app');
app.directive('sendData', [
        '$compile', '$timeout', '$http', function ($compile, $timeout, $http) {
            return {
                require: 'ngModel',
                link: function (scope, el, attrs, ctrl) {                         
                    el.on('on-select', function () {
                        console.log("changed");
                    });                 
                }
            };
        }
]);

console.log("changed"); 语句未在上述指令中触发。这是怎么回事，是不是我记错了？

我知道我可以从控制器绑定到on-select 事件。但我想在自定义属性中实现这一点。

【问题讨论】：

标签： angularjs angular-directive angular-ui-select

【解决方案1】：

你不能，on-select 不是一个事件（如 click、keydown），所以你可以绑定一个监听器，ui-select implement it 他们只是绑定一个控制器或父级函数。

所以最好让ui-select处理on-select方法。

如果您在on-select 中有任何DOM 操作，那么在您的sendData 指令中，您必须找到正确的li 元素并设置click 事件。

【讨论】：