AngularUI select2 onChange 方法 [英] AngularUI select2 onChange method

问题描述

我该如何着手做这些事情:

How do I go about doing something along these lines:

   <select ui-select2 multiple="true" on-change="onChange()" data-ng-model="select2Model"></select>

在我的控制器中，我定义了 onChange(select2OnChangeData).

where in my controller, I have the onChange(select2OnChangeData) defined.

我尝试添加这个

    scope: {
        model: "=ngModel",
        onChange: "&onChange"
    },

到 angular-ui，但这改变了范围变量并破坏了其余的功能.

to angular-ui, but that changed the scope variable and broke the rest of the functionality.

我真的不想这样做:

.on("change", function(e)

.on("change", function(e)

推荐答案

好在我在我的项目中做到了这一点:

Good thing I did just this in my project:

HTML

<select data-placeholder="Select an asset" class="input-xxlarge" ui-select2="sourceAssetId" ng-model="sourceAssetId" ng-options="asset.id as asset.name for asset in assets"></select>

指令

module.directive("uiSelect2", function() {
    var linker = function(scope, element, attr) {
        element.select2();

        scope.$watch(attr.ngModel, function(newValue, oldValue) {
            console.log("uiSelect", attr.ngModel, newValue, oldValue);

            // Give the new options time to render
            setTimeout(function() {
                if(newValue) element.trigger("change");
            })
        });
    }

    return {
        link: linker
    }
});

相关控制器代码

$scope.$watch("sourceAssetId", function(newValue, oldValue) {
    if(newValue) $scope.fetchAsset();
});

这篇关于AngularUI select2 onChange 方法的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！