Question

我不了解angular.js中的数据绑定：

如果您多次点击“addSomething”，则每次点击都会显示“test3”。
现在如果点击“addSomething2”，即使在2009年之前也没有任何显示。
但是如果你点击“addSomething”“test4”也会出现，但只有你在2009ms之后点击，否则“test4”也不会出现。
如果你点击“addSomething2”并在2009ms之后点击“addSomething2”，就会出现一个“test4”。

这只是我使用socket.io时出现的问题的一个简单示例并有一些socket.on（）事件绑定。在那种情况下，我的“addSomething2”ng-click绑定将是socket.on（'addSomething2'），但结果仍然相同。

因为我是angularjs的新手，我不知道我在这里做错了什么。

HTML：

 <div ng-app>   
     <div id="edit" ng-controller="Edit">
        <a href="" ng-click="addSomething()">addSomething  </a><br>
        <a href="" ng-click="addSomething2()">  addSomething2</a>
        <div ng-repeat="doneMsgs in doneSoFar">
            {{doneMsgs.status}}:{{doneMsgs.info}} <br>
        </div>
     </div>

    </div>

JS：

function Edit（$ scope）{

$scope.doneSoFar = [];
$scope.doneSoFar.push({status:"test",info:"test"})
var doneSoFarPush = function(status,info){
    $scope.doneSoFar.push({status: status,info:info });
};
doneSoFarPush('test2','test2');

$scope.addSomething = function() {
    doneSoFarPush('test3','test3');
};

$scope.addSomething2 = function() {
    setTimeout(function(){
    doneSoFarPush('test4','test4');
    },2009);
};
};

Answer 1

您需要直接使用$timeout服务而不是setTimeout。这将允许角度来管理$digest周期。否则，您必须自己管理范围$apply。

Here is an updated fiddle

更新的代码：

function Edit($scope, $timeout) {


    $scope.doneSoFar = [];
    $scope.doneSoFar.push({status:"test",info:"test"})
    var doneSoFarPush = function(status,info){
        $scope.doneSoFar.push({status: status,info:info });
    };
    doneSoFarPush('test2','test2');

    $scope.addSomething = function() {
        doneSoFarPush('test3','test3');
    };

    $scope.addSomething2 = function() {
        $timeout(function(){
        doneSoFarPush('test4','test4');
        },2009);
    };
};

如果使用setTimeout，angularjs奇怪的数据绑定行为

1 个答案: