Question

我无法获取$ scope变量来触发屏幕重新绑定。是的，我在分配$ scope.value = value之后尝试调用$ scope。$ apply（）;是的，我已经尝试在分配后手动调用$ digest（）;我收到错误“$ rootScope：inprog] $ digest正在进行中。

所以我所做的就是尝试获取我的$ rootScope。$ on（'message'function（）{}）监听器，为所有范围创建一个辅助$广播，试图找到它的底部;但是，我的$ scope的事件注册没有解雇，我认为这可能与同一个问题有关......也许不是。无论如何，这是我的代码。

我建立了一个小提琴，但它目前被网络政策阻止。

清单：

[配置]
[index.html的]
[foo.html]
[CTRL]

[config]（几次尝试黑客攻击。他们标有评论）

    var kata = angular.module('kata',[
        'ngRoute'   
    ]).run(['$rootScope',
    function($rootScope){
        $rootScope.$on('message:foo',function(event,data){
            $rootScope.$broadcast('message:bar',['foo1','foo2','foo3']);//send secondary msg
            $rootScope.data = data; //Hack #1: When I couldn't get $scope to rebind, I tried to use $rootScope;still doesn't rebind.
        });
    }]);

kata.config(['$routeProvider',
    function($routeProvider){
        $routeProvider
            .when('/Foo',{
                templateUrl: 'foo.html',
                controller: 'FooCtrl'
            });
}]);

[index]（这里没什么好笑的）

<html ng-app="kata">
    <head>
        <meta http-equiv="X-UA-Compatible" content="IE=edge,Chrome=1"></meta>
        <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.25/angular.js"></script>
        <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.25/angular-route.js"></script>

        <script src="./routingConfig.js"></script>
        <script src="./controllers.js"></script>        
    </head>
    <body>
        <div class="view-container">
            <div ng-view class="view-frame"></div>
        </div>
    </body>
</html>

[foo.html]（这里没什么好笑的）几个测试与几个$ scope变量附加到相同的东西。这些都没有更新

<div>
    This page is for capturing Data

    Data: {{data}}
    <hr />
    <ul>
        <li ng-repeat="foo in foos">
            <span>Foo Found!</span>
        </li>
    </ul>
</div>

[ctrl]（在范围内创建了几个变量，试图以不同的方式攻击这个问题）

var kataCtrl= kata.controller("FooCtrl", 
    [        '$scope', '$http','$rootScope','$location'
    ,function($scope,   $http,  $rootScope , $location) {
        $scope.data = "Foo";
        $scope.data1 = "[placeholder]";
        $scope.foos = [];


        //fires, assigns, view does not update
        $scope.$watch(function(){
            return $rootScope.data;
        }, function(){
            $scope.foos = ['data','foo','bar','baz'];<=Assignment succeeds. View does not update
            $scope.$apply();//<=Does nothing apparent; View does not update
            $scope.$digest();//<= Console Error. Already in digest loop
        },true);


        //does not fire
        $scope.$on('message:foo',function(event,data){ //<= This never catches
            $scope.data = data; 
        });


        //fires, assigns, View does not update
        $rootScope.$on('message:bar',function(event,data){
            $scope.foos = ['data','foo','bar','baz'];
            $scope.foo1 = data.element1;
            $scope.data = "[Foos returned from $rootScope]";
            $scope.$apply();//<= Does not help. Changing to $scope.$digest() indicates already in digest loop
        });
}]);

作为回顾，我的配置中的$ rootScope。$ on（）正在触发。它正确地为$ rootScope上的变量赋值。 $ rootScope。$ broadcast正在生成辅助消息。控制器的$ scope $。注册消息时没有捕获。控制器的$ rootScope。$ on注册会触发并分配$ scope的值，但视图不会重新绑定。调用$ scope。$ apply（）没有帮助。调用$ scope。$ digest（）仅报告当前正在运行摘要循环。

分配了范围变量，但视图从不重新绑定。

广泛的体育世界在这里发生了什么？

Answer 1

我认为问题是你正在播放'message：bar'并在控制器中收听'message：foo'。我已经制作了代码的简化版本。您可以看到我的代码将事件发送到根范围并在子范围内发布广播事件：

<html ng-app="kata">
    <head>
        <meta http-equiv="X-UA-Compatible" content="IE=edge,Chrome=1"></meta>
        <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.25/angular.js"></script>
        <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.25/angular-route.js"></script>
   
    </head>
    <body>
        <div class="view-container" ng-controller="FooCtrl">
            <div class="view-frame">
            <div>
                This page is for capturing Data
                <br>
                Data: {{data}}
                <hr />
                <ul>
                    <li ng-repeat="foo in foos">
                        <span>Foo Found!</span>
                    </li>
                </ul>
            </div>
            </div>
        </div>
        
        <script>
            var kata = angular.module('kata',[
                    'ngRoute'   
                ]).run(['$rootScope',
                function($rootScope){
                    $rootScope.$on('message:foo',function(event,data){
                        $rootScope.$broadcast('message:bar',['Data', 'from', 'root', 'scope']);//send secondary msg
                    });
                }]);


            kata.controller("FooCtrl", 
                [        '$scope', '$http','$rootScope','$location'
                ,function($scope,   $http,  $rootScope , $location) {
                    $scope.data = "Foo";
                    $scope.data1 = "[placeholder]";
                    $scope.foos = [];

                    $scope.$on('message:bar',function(event,data){
                        $scope.data = data; 
                    });
                    
                    $scope.$emit('message:foo');
            }]);
        </script>
    </body>
</html>

AngularJS（1.2.25）$ rootScope。$ broadcast（'message'，data）没有被$ scope接收。$ on（'message'）

1 个答案: