更新指令托管的ng-options

时间:2014-12-11 13:47:07

标签: angularjs angularjs-directive angularjs-ng-repeat

我有一个显示下拉列表的自定义指令。

是否可以从来自托管指令的控制器的数据源动态重新填充ng-options。

数据源本身来自服务。 目前它从传递给指令的初始数组运行良好,但是当我添加新数据时(从控制器/服务到这个数组,我想更新项目列表。

任何帮助?

编辑:

这就是我使用指令的方式。

   <select-item-obj-from-array datasource="ctrl.ActivityAddresses" ng-model="form.Activity.AddressID" name="AddressID" value="AddressID" label="City" .... />

我的指示如下:

app.directive('selectItemObjFromArray', function () {
return {
    restrict: 'E',
    replace: true,
    template: function (element, attrs) {
        var tpl = '';
        tpl += "<div><div class=\"form-group clearfix\" >";
        tpl += '<label  for="' + attrs.name + '" class="col-lg-3 control-label">' + attrs.label + '</label>';
        tpl += '<div class="col-lg-9">';
        tpl += '<select ng-disabled="ngDisabled" name="' + attrs.name + '" ng-model="ngModel"   chosen="datasource" ng-options="c.Name for c in datasource"></select>';

        tpl += '</div>';
        tpl += '</div>';
        tpl += '</div>';
        return tpl;
    },
    scope: {
        ngModel: "=",
        datasource: "="
    },
    link: function (scope, elem, attrs) {
        var select = elem.find("select").eq(0);
        select.chosen();
        scope.$watch(function () {
            return select[0].length;
        },
        function (newvalue, oldvalue) {
            if (newvalue !== oldvalue) {
                select.trigger("chosen:updated");
            }
        });
        scope.$watch(attrs.ngModel, function () {
            select.trigger('chosen:updated');
        });
    }
};
});

如果我的控制器/服务更新了ctrl.ActivityAddresses,我不知道如何“重新启动”指令来更新下拉列表..

1 个答案:

答案 0 :(得分:0)

您可以通过以下服务进行广播:

var broadcast = function() {
    $rootScope.$broadcast('items.update');
 };

假设items是一个数组。

然后你可以在控制器或指令中捕捉广播:

$scope.$on('items.update', function (event) {
    //Do whatever you want with the items.
});

我认为这就是你想要的?您不需要为此更改ng-options指令。