Question

我有这样的控制器：

function postCtrl($scope){
    $scope.model = { title: 'one' };

    window.setInterval(function(){
        $scope.model += ' more one,';
    }, 1000);
}

查看方：

<div ng-controller="postCtrl">
     <input type="text" ng-model="model.title"/>
</div>

我希望textbox在model.title更改（每1秒）时自动刷新值。请告诉我是否可能

Answer 1

使用$timeout将函数包装在try / catch-block中以进行正确的异常处理，并执行$ scope.apply（）;对你来说，并且比普通的window.setInterval：

更容易测试

function postCtrl($scope, $timeout){
    $scope.model = { title: 'one' };

    $timeout(function(){
        $scope.model += ' more one,';
    }, 1000);
}

Answer 2

在一些AngularJS观察到的Context之外应用的模型更改应该包含在范围内。$ apply（function（）{...}）;

http://docs.angularjs.org/api/ng.$rootScope.Scope

window.setInterval(function(){
    $scope.$apply(function(){
       $scope.model += ' more one,';
    });
}, 1000);

Answer 3

您只需致电$scope.$apply或将其包裹在$scope.model作业中。

function postCtrl($scope){
    $scope.model = { title: 'one' };

    window.setInterval(function(){
        $scope.model.title += ', 1';
        $scope.$apply();
    }, 1000);
}

示例：http://jsfiddle.net/qeD6Q/

Answer 4

如果您愿意使用其他库，KnockoutJS会做同样的事情。绑定模型，每当模型更新时，相应的HTML都会刷新。

更新模型更改的HTML

4 个答案: