Question

我正在尝试通过在输入[数字]中键入数字来填充输入。

为什么这不起作用

＆＃13;

// Code goes here

var app = angular.module('app', []);

app.controller('MainCtrl', function($scope) {
    $scope.lengInput = {
        count: 0,
        values: [],
        fill: function(limit) {
            var sequence = [];
            for (var i = 0; i < limit; i++) {
                sequence.push(i);
            }
            return sequence;
        }
    };
});

＆＃13;

<!DOCTYPE html>
<html ng-app="app">

  <head>
    <meta charset="utf-8" />
    <title>AngularJS Plunker</title>
    
    <link rel="stylesheet" href="style.css" />
    <script data-require="angular.js@1.5.x" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.11/angular.js" data-semver="1.5.11"></script>
    <script src="script.js"></script>
  </head>

  <body ng-controller="MainCtrl">
    <p>Hello {{name}}!</p>
    <input ng-model="lengInput.count" type="number" min="1" max="20">
    <ul>
        <li ng-repeat="i in lengInput.fillSequence(lengInput.count)">
            <input ng-model="lengInput.values[i]" />
        </li>
    </ul>
  </body>

</html>

＆＃13;

因为这是有效的

JSFiddle Demo

请找出我的错误。

Answer 1

您可以使用ng-repeat初始化ng-init，并将$scope.lengInput.values添加到ng-change的输入字段，而不是将该函数直接附加到$scope.lengInput.count。正在设置，所以函数不会每次都运行，而是只在输入框中的值发生变化时运行！

＆＃13;

// Code goes here

var app = angular.module('app', []);

app.controller('MainCtrl', function($scope) {
  $scope.lengInput = {
    count: 0,
    values: [],
    fill: function(limit) {
      var sequence = [];
      for (var i = 0; i < limit; i++) {
        sequence.push(i);
      }
      $scope.lengInput.values = sequence;
    }
  };
});

＆＃13;

<!DOCTYPE html>
<html ng-app="app">

<head>
  <meta charset="utf-8" />
  <title>AngularJS Plunker</title>

  <link rel="stylesheet" href="style.css" />
  <script data-require="angular.js@1.5.x" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.11/angular.js" data-semver="1.5.11"></script>
  <script src="script.js"></script>
</head>

<body ng-controller="MainCtrl" ng-init="lengInput.fill(lengInput.count)">
  <p>Hello {{name}}!</p>
  <input ng-model="lengInput.count" type="number" min="1" max="20" ng-change=" lengInput.fill(lengInput.count)">
  <ul>
    <li ng-repeat="i in lengInput.values">
      <input ng-model="lengInput.values[i]" />
    </li>
  </ul>
</body>

</html>

＆＃13;

按数字angularjs填充输入

1 个答案: