首页 文章

AngularJS - 绑定到数组没有反映在指令中

提问于
浏览
-1

我正在编写一个可以呈现控件集合的指令 .

每个控件都是一个名为 fsFilter 的指令 - 在我的控制器中控制父元素,我将 filters 数组绑定到父作用域中的数组 .

这很好,并且在首次编译指令时会呈现子指令 .

当我向父作用域中的 filters 数组添加一个新对象时,我可以看到(使用 $watch )子作用域内的绑定数组已更改但是属性中的更改没有't 2805311 . I'尝试添加 $apply 并使用 addFilter 方法该指令的范围而非hackishly调用 element.scope() 来直接调用该函数 . 这是因为你期望更新数组,但仍然没有重组 . 这也不会让我在将新对象添加到数组后直接调用 $apply .

这是我的指示

.directive('fsFilterCollection', function ($compile, $timeout) {
    return {
        restrict: 'AE',        
        priority: 1002,
        scope: {
            filters: "="           
        },
        controller: function ($scope, $element, testFactory) {
            $scope.filterIndex = 0;

            $scope.filterClosedFn = function ($event, filterdata) {
                $event.stopPropagation();
                $scope.filters = $scope.filters.filter(function (el) { return el.name != filterdata });
                console.log("filter closed" + testFactory.sayHello());
            }

            if ($scope.filters) {
                angular.forEach($scope.filters, function (el) { el.index = $scope.filterIndex++; });
            }

            $scope.addFilter = function () {  
                if (arguments.length == 1 && angular.isObject(arguments[0])) {
                    $scope.filters.push(arguments[0]);
                }
                else {
                    $scope.filters.push({ filterType: "String" });
                }             
            }
        },
        template: function (element, attr) {
            return  '<div>'+
                    '   <div ng-repeat="filter in filters">'+
                    '     <div>',
                    '          <div fs-filter keepopen="true" filter-closed-fn="filterClosedFn" isopen="isopen" keepopen="true" filterdata="filter.filterdata" fs-filter actions="true" filter-type="String"></div>' +
                    '       </div>'+
                    '   </div>'+
                    '</div>'
        },
        link: function ($scope, element, attrs, ngModelController) {

            $scope.$watch('filters', function () {
                // reindex
                $scope.filterIndex = 0;
                angular.forEach($scope.filters, function (el) { el.index = $scope.filterIndex++; });
            },true);
        }
    }
})

这是我的父控制器:

var myAppModule = angular.module('development-beta', ['ui.select', 'ui.bootstrap','firespace.filtercontrol','ngSanitize']);
        myAppModule.controller('fs-controller', ['$scope', function ($scope) {

            $scope.filters = [
                { filterType:"String" }
            ];            

            $scope.addFilter = function () {
                $("#myfilters *[fs-filter]").scope().addFilter();
            }
        }]);

另外,如果能告诉我更新父作用域中的绑定数组是否正确的方法呢?我读了一些关于使用工厂的信息,但由于它是单例,我无法看到如何在不将$ scope传递给每个调用的情况下管理每个指令的范围?

谢谢你的建议

1 回答

  • 0

    对不起,有一个糟糕的一天 .

    如果其他人有ng-repeat没有绑定的问题,可能,可能只是可能与...有关...

    template: function (element, attr) {
                return  '<div>'+
                        '   <div ng-repeat="filter in filters">'+
                        '     <div>',
                        '          <div fs-filter keepopen="true" filter-closed-fn="filterClosedFn" isopen="isopen" keepopen="true" filterdata="filter.filterdata" fs-filter actions="true" filter-type="String"></div>' +
                        '       </div>'+
                        '   </div>'+
                        '</div>'
            },
    

    在模板中,我不小心使用了','(逗号)而不是将它与''连接(第4行)

    我真的希望有一天能帮助别人 .

相关问题