Question

我只有一小段代码来测试我可以用Angular做的一些事情，显然当你这样做时没有任何东西可以工作。这是html（正确连接到angular和脚本文件，我很确定，因为以前的测试工作且控制台没有抛出任何错误）： HTML：

<div ng-controller='greet'>
    <p>Welcome {{first}}<span id='name' ng-click='addUserName()' title='click to change name'>{{userName}}</span>! This is the <span id='number' ng-click='resetNumber()' ng-attr-title='if you ask, it {{isPrimeNumberView}} a prime number. Click to reset'>{{number}}</span> time you visit the main page</p>
  </div>

JS：

if(!localStorage.number){
    localStorage.number=1;
}else{
    ++localStorage.number;
}
if(!localStorage.userName){
    localStorage.userName='[click]';
}
function greet($scope){
    function addUserName(){
        localStorage.userName=prompt('Name?');
        $scope.userName=localStorage.userName;
        $scope.$apply();
    }
    function resetNumber(){
        localStorage.number=0;
        $scope.number=0;
        $scope.$apply();
    }
    if(localStorage.first){
        $scope.first='back ';
    }else{
        localStorage.first=true;
    }
    $scope.number=localStorage.number;
    $scope.userName=localStorage.userName;
    $scope.isPrimeNumberView='IS';
    var n=localStorage.number;
    if(n==1){$scope.isPrimeNumberView='is not';}
    for(var i=2; i<=Math.sqrt(n); ++i){
        if(n%i==0){$scope.isPrimeNumberView='is not'; i=n;}
    }
}

如果您尝试更改名称，则在重新加载页面之前不会更新它，如果您单击数字以重置它们，则在重新加载页面之前它不会显示。这不是Angular的典型：有人可以告诉我我做错了吗？

Answer 1

您的点击事件处理程序在Angular的摘要周期之外运行。您需要在更改值后调用$scope.$apply()。如果您希望它自动运行，请使用ngClick绑定处理程序。

此外，您的函数应声明为scope对象的方法。例如：function resetNumber()应为$scope.resetNumber = function()

角度文本在预期时不会更新

1 个答案: