Question

我有this fiddle example我试图在一个生活在不同范围内的ng-repeat中设置一个值。这是我试图解决的更大问题的一个非常基本的例子。基本上我需要在ng-repeat中设置一个变量，这样angular就会相应地更新模板。问题是模板在子控制器中。所以我使用$ controller注入来访问变量。但是，更新此变量不会导致模板更新。即使我做了一个范围。$ apply（）。有人有主意吗？我不确定另一种方式来做这件事......

var myApp = angular.module('myApp', []);

myApp.directive("custdirective", function() {
    return {
        restrict: 'A',
        scope: 'false',
        link: function(scope, element, attr) {
            element.on("click", function() {
            anotherscope.addList();
            });
        }
    }
});

function AnotherController($scope) {
    $scope.listtwo = new Array();
    $scope.addList = function() {
        $scope.listtwo = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
    }
}

function MyCtrl($scope, $controller, $rootScope) {
    anotherscope = $rootScope.$new();
    $scope.anothercontroller = $controller(AnotherController, {
        $scope: anotherscope
    });
}

要正确执行此操作，可以创建服务。我做了一个更新的小提琴正确的方法here或：

var myApp = angular.module('myApp', []);

myApp.factory("mySharedService", function($rootScope) {
    var sharedService = {};
    sharedService.message = '';

    sharedService.prepForBroadcast = function() {
        this.message = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
        this.broadcastItem();
    };
    sharedService.broadcastItem = function() {
        $rootScope.$broadcast('handleBroadcast');
    };

    return sharedService;

});

myApp.directive("custdirective", function() {
    return {
        restrict: 'A',
        scope: 'false',
        link: function(scope, element, attr) {
            element.on("click", function() {
                debugger;
                scope.handleClick();
            });
        }
    }
});

function AnotherController($scope, sharedService) {
    $scope.listtwo = new Array();
    $scope.addList = function() {
        $scope.listtwo = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
    }

    $scope.$on('handleBroadcast', function() {
        $scope.listtwo = sharedService.message;
    $scope.$apply();
    });
}

function MyCtrl($scope, sharedService) {
    $scope.handleClick = function() {
        sharedService.prepForBroadcast();
    };
}


MyCtrl.$inject = ['$scope', 'mySharedService'];        

AnotherController.$inject = ['$scope', 'mySharedService'];

Answer 1

像这样传递范围有点不稳定，几乎可以保证破坏Angular应用程序的可测试性。

我认为你的控制器和你的指令之间的变化促使creating a service变得更好。该服务将包含您希望更新的阵列，或者您希望从指令中调用的函数。

我担心写这样一个服务的例子很难，因为我真的不明白你的最终目标是什么。

从角度js中的父范围更新子范围的模板

1 个答案: