Question

首先，我有一个ng-model，你从html数字输入类型中选择了一些条目，然后我想用这个选择产生一个带有ng-repeat的循环并创建其他输入形式

代码开头如下：

<div data-ng-app="myapp" data-ng-init="entries=0" class="form-group" style="width: 300px;height: 100px;">
        <label for="input_nr">Input:</label>
        <input type="number" ng-model="entries" class="form-control" id="input_nr" min="0" step="1" value="0">
        </br>            
            <ul>
                <li ng-repeat="{{$entries}}"><span>hello</span></li>
            </ul>
    </div>

我的$ scope.myNumber应该等于＆＃34;条目＆＃34;中存储的值。来自ng模型。请给我一些建议。

我附上一个JSFiddle。 http://jsfiddle.net/CasianS/vaf44jwz/。

所以如果我选择9（例子）我想要显示9次＆＃34;你好＆＃34;。

Answer 1

编辑：看到OP提供的小提琴，我对情况有了更好的了解。你想要的是这样的HTML：

<h3>ng-repeat example</h3>
<div ng-app ng-controller="MyCtrl">
<label for="input_nr">Input:</label>
<input type="number" ng-model="entries" ng-change="upateEntries()" class="form-control" id="input_nr" min="0" step="1" value="0">
</br>
<ul>
    <li ng-repeat="item in items track by $index">{{item}}</li>
</ul>

Javascript就像这样：

var m = 'hello'

function MyCtrl($scope) {
    $scope.entries = 0;
    $scope.items = [];
    $scope.upateEntries = function () {
        $scope.items = [];
        for (var i = 0; i < $scope.entries; i++) {
            $scope.items.push(m);
        }
    }
}

（或多或少）。正如评论中所指出的，ng-repeat很像foreach循环。它只是迭代一个对象或一个数组。见https://docs.angularjs.org/api/ng/directive/ngRepeat

此方法设置一种方法，该方法在输入更改时触发，并将所需项添加到数组指定的次数，并且ng-repeat迭代该项。请注意，你不能在ng-repeat中有重复项，所以如果你使用这样的策略，你必须通过$ index语句添加轨道。

小提琴：https://jsfiddle.net/Cavanaghacea/19x5mmum/12/

// OLD ANSWER BELOW

您应该可以使用limitTo：filter - 就像这样：

<div ng-app="myapp">
      <div ng-controller="ctrlParent">
          <ul>
              <li ng-repeat="entries" | limitTo:$scope.myNumber><span>{{$index+1}}</span></li>
          </ul>

      </div>
</div>


    <script>
        var app = angular.module('myapp',[]);
        app.controller('ctrlParent',function($scope){
            $scope.myNumber = 3;
            $scope.getNumber = function(num) {
                return new Array(num);   
            }
        });
    </script>

AngularJS ng-repeat与输入表单中给定数量的循环

1 个答案: