自更改指令范围后,指令不显示服务数据

时间:2015-11-17 19:16:38

标签: angularjs

目前有一个指令,模板使用ng-repeat来创建按钮列表。当使用隔离范围时,列表会填充,但是出于必要的原因,我将范围更改为true时,列表不再显示。

以下是代码的粗略示例......

指令功能

var list= function () {
    return {
        templateUrl: "list.html",
        restrict: 'E',
        scope: true,
        link: function (scope, element, attrs) {

            scope.id = scope.$eval(attrs.id);
            scope.header = scope.$eval(attrs.header);
            scope.items = scope.$eval(attrs.items);

            // button listeners...
        }
    };
};

控制器

var self = this;
self.duckItems = [];
self.gooseItems = [];

    dataSvc.getListItems()
    .then(function (response) {
                    self.duckItems = response.data;
                    self.gooseItems = _.union(self.gooseItems,   _.flatten(_.map(self.duckItems , function (duck) {
                        return _.map(duck.goose, function (goose) {
                            return {name: goose};
                        });
                    })));
                }, function (reason) {
                    console.log('crap ' + reason);
                });

服务

serviceModule.service('dataSvc', ['$http', function ($http) {
        var self = this;
        self.getListItems= function () {
            return $http.get('js/list_items.json');
        };
    }]);

模板

<ul>
        <li ng-repeat="item in items" ng-class="(item.selected ? 'RUIFW-selected' : '')" ng-click="click(item)">
            <label>{{ item.name }}</label>
            <input type="checkbox" ng-model="item.selected" />
        </li>
    </ul>

1 个答案:

答案 0 :(得分:0)

友好的编码人员在指令元素中添加了ng-if =“dataHasLoaded”,并在promise中将其翻转为true。我们取得了成功。

问题是该指令是在服务完成之前加载的。