Question

我尝试使用Angular将数据从JavaScript发送到html ... 我有这个代码

phonecatControllers.controller('start', ['$scope', function($scope){
    $scope.lloadd=true; 
    console.log('data - '+$scope.lloadd); 

    function second_passed() {
        $scope.lloadd=false; 
        console.log('data - '+$scope.lloadd); 
        alert('sdasd');
    }
    setTimeout(second_passed, 3000); 
}]);

这个HTML代码

<div  ng-show="lloadd">
12312312
</div>

当我启动应用程序DIV是可见的...但3秒后我只看到提醒... 这是我的日志

01-08 16:34:25.608: I/chromium(22042): [INFO:CONSOLE(179)] "data - true", source: file:///android_asset/www/js/controllers.js (179)

01-08 16:34:28.613: I/chromium(22042): [INFO:CONSOLE(182)] "data - false", source: file:///android_asset/www/js/controllers.js (182)

Answer 1

您必须使用angularjs $timeout而不是setTimeout。如果setTimeout有角度，则不会通知某些内容发生了变化，但$timeout确实会发生变化。

但您也可以在$scope.$apply()中使用second_passed()，但我不建议这样做。

Answer 2

问题是您是否正在使用setTimeout更改角度无法了解的$scope上的角度数据。

你需要阅读有关角度的$digest cycle，但简而言之，你需要告诉角度有些事件已经发生。

对于超时，angular提供了一项为您执行此操作的服务，名称为$timeout，因此非常简单：

phonecatControllers.controller('start', function($scope, $timeout){
 $scope.lloadd=true; 
 console.log('data - '+$scope.lloadd); 
 function second_passed() {
    $scope.lloadd=false; 
    console.log('data - '+$scope.lloadd); 
    alert('sdasd');
 }
 $timeout(second_passed, 3000); 
});

当然一定要将$timeout添加到控制器函数的参数中，以确保它被注入。

请注意，您可以使用$scope.$apply()在second_passed函数中触发摘要来获得相同的结果：

function second_passed() {
  $scope.$apply( function () {
    $scope.lloadd=false; 
  });
  console.log('data - '+$scope.lloadd); 
  alert('sdasd');
}

但出于以下几个原因，这是不可取的：

还有更多代码！
如果正在进行其他摘要，则使用$scope.$apply()手动触发摘要可能会导致问题，因此通常最好避免使用摘要。
$timeout添加的不仅仅是$scope.$apply包装器 - 它还会返回一个承诺，并且在您进行测试时会有一个方便的flush()装饰器。

无论您是否习惯使用承诺和编写测试，都应该使用$timeout，因为有一天将想要使用这些功能。

我的js代码有什么问题？

2 个答案: