Question

我是一名日本学生。所以我的英语不容易阅读。对不起。

我使用AngularJS制作了素数列表。用户输入两个值， valFrom 和 valTo 。该列表由两个数字构成。

我想将输入值绑定到列表中。当我输入输入时，列表会动态地更改值。但它并没有。当我输入输入时，列表不会改变。我想将值绑定到列表。

以下是我的观点。值没有排序，因为使用了Object，而不是Array。

这是index.html。

<!doctype html>
<html lang="ja" ng-app="MYAPP">
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-rc.2/angular.min.js">   </script>
    <script src="script.js"></script>
</head>

<body>
    <div ng-controller="inputCtrl">
        <h1>Make prime number list from {{fromVal}} to {{toVal}}</h2>
        <input type="number" ng-model="fromVal"><br>
        <input type="number" ng-model="toVal"><br>

        <!-- prime numbers list -->
        <div ng-controller="primeListCtrl">
            <div ng-repeat="(val, flag) in primeFlags">
                {{val}}</td><td>{{flag==true? "is prime": "isn't prime"}}
            </div>
        </div>
    </div>

</body>

的script.js

angular.module('MYAPP', []).

controller('inputCtrl', function($scope){
    $scope.fromVal = 10;
    $scope.toVal = 50;
}).

controller('primeListCtrl', function($scope){
    /* 
        If primeFlags[i + ""] is true, i is prime number.
        Keys are string, values are boolean. 
    */
    $scope.primeFlags = {};

    // fill with true
    for(var i = 2; i <= $scope.toVal; i++){
        $scope.primeFlags[i+""] = true;
    }
    // set false
    for(var i = 2; i <= $scope.toVal; i++){
        for(var j = 2; j < i; j++){
            if(i%j === 0){
                $scope.primeFlags[i+""] = false;
                break;
            }
        }
    }
});

我认为输入值没有绑定到列表的原因是 primeFlags 没有改变。更改输入值时， primeFlags 不会更改。因此，列表没有更新。

我正在考虑两种解决方案。首先，使用 $ scope。$ watch（）观察输入值。其次，使用 $ broadcast（）和$ on（）来观察输入值。更改值后，重新制作 primeFlags 。但是，我认为解决方案并不好。有更好的解决方案吗？

Answer 1

素数列表是否完全动态？如果是这样，您可以在函数上创建主要列表，然后在转发器中使用该函数的结果：

$scope.primeFlags = function(){
      var primeList = {};
      // fill with true
      for(var i = 2; i <= $scope.toVal; i++){
          primeList[i+""] = true;
      }
      // set false
      for(var i = 2; i <= $scope.toVal; i++){
          for(var j = 2; j < i; j++){
              if(i%j === 0){
                  primeList[i+""] = false;
                  break;
              }
          }
      }

      return primeList;
    };

并在HTML上：

<div ng-repeat="(val, flag) in primeFlags()">

如果您可以建立某种边界，我认为提前创建素数列表更有效，然后在您的函数上显示该列表的一个子集：

app.controller('primeListCtrl', function($scope){
    /* 
        If primeFlags[i + ""] is true, i is prime number.
        Keys are string, values are boolean. 
    */
    var primeList = [];
    // fill with true
    for(var i = 0; i <= 1000; i++){
        primeList[i] = {id: i, flag: true};
    }
    // set false
    for(var i = 0; i <= 1000; i++){
        for(var j = 2; j < i; j++){
            if(i%j === 0){
                primeList[i].flag = false;
                break;
            }
        }
    }

    $scope.primeFlags = function(){
      return primeList.slice($scope.fromVal, $scope.toVal);

    };
});

和HTML

<div ng-repeat="val in primeFlags()">
                {{val.id}}&mdash;{{val.flag==true? "is prime": "isn't prime"}}
            </div>

AngularJS将变量绑定到与变量相关的数组

1 个答案: