Question

我正在学习有关棱角分明的一切。我知道有很多关于角度绑定的SO问题，但我仍在苦苦挣扎。也许有人可以通过这个例子给我一些清晰度。

        .controller('myCtrl',['$scope',function($scope){

            //define dummy usermanager "class" 
            var um = function(){
                this.username = 'myUsername';
            };

            //init dummy user class 
            var _um = new um();

            //Bind usermanager to scope 
            $scope.UserManager = _um;

            //After three seconds set new username 
            setTimeout(function(){
                console.log('set');
                _um.username = 'newUsername';
            },3000);
        }]);

使用基本模板

<p>{{ UserManager }}</p>

在此示例中，它始终显示为{username：myUsername}，永远不会更改为{username：newUsername}

如何在此示例中正确使用Angulars双向绑定？

修改看来我可以使用$ scope。$ apply（）;但这似乎不是最好的方法。

Answer 1

正如其他人所指出的，角度不知道$scope的变化。您应该使用$timeout而不是将您的功能包裹在$apply

中

$timeout(function() {
    console.log('set');
     _um.username = 'newUsername';
}, 3000);

Answer 2

$ scope.UserManager指向对象_um。

当您说_um.username ='newUsername'时，这将更改_um对象的属性值。如果之后你尝试console.log（$ scope.UserManager.username） - 这将输出正常。

但是，当你说_um.username ='newUsername'时，Angular不知道某些内容会影响范围内的数据。因此，它不会使用新的$ scope值刷新DOM。

您可以使用$ scope调用此方法。$ apply（）; （建议不要）

您可以了解AngularJS中的观察者 - 这可能有所帮助。

Answer 3

AngularJS实际上在$ apply调用中调用了几乎所有代码。 ng-click，控制器初始化，$ http回调等事件都包含在$ scope。$ apply（）中。所以你不需要自己打电话，事实上你不能。在$ apply内调用$ apply会引发错误。

如果要在新的回合中运行代码，则需要使用它。并且只有当没有从AngularJS库中的方法创建该转弯时。

在新的回合中，您应该将代码包装在$ scope中。$ apply（）。 setTimeout将在延迟后的新回合中执行一个函数。由于Angular不知道新的转弯，因此不会反映更新。

所以你的解决方案是使用$ scope。$ apply是完全合适的。

            $scope.$apply(function(){
                _um.username = 'newUsername';
            })

为什么这不绑定？

3 个答案: