Question

我在使用它时遇到了一些麻烦。我在模态中有一个表单，我想基于用户在上面的输入中输入的数字生成一些输入。

<form ng-submit="saveNewCategory(cat)">
      <div class="list">
        <label class="item item-input">
        <span class="input-label"><strong>Name:</strong></span>
          <input type="text" value="" placeholder="Hw" ng-model="cat.title">
        </label>
         <label class="item item-input">
        <span class="input-label"><strong>Number of {{cat.title}}</strong></span>
          <input type="tel" value="" ng-model="cat.number">
        </label>
        <!-- PROBLEM IS HERE -->
        <label class="item item-input" ng-repeat="i in range(cat.number)">
        <span class="input-label"><strong>blah</strong></span>
        <input type="tel" value="" >
        </label>
        <label class="item item-input">
        <span class="input-label"><strong>Total Points:</strong></span>
          <input type="tel" value="" ng-model="cat.total">
        </label>
        <label class="item item-input">
        <span class="input-label"><strong>Weight:</strong></span>
          <input type="tel" value="" ng-model="cat.weight">
        </label>
      </div>
      <div class="padding">
        <button type="submit" class="button button-block button-positive">Save</button>
      </div>
    </form>

在我的控制器中，范围功能是

$scope.range = function(n) {
    return new Array(n);
};

那为什么这不起作用？只生成一个输入元素。你能否在ng-repeat中使用表单模型对象值？

感谢您的帮助！

Answer 1

目前，您的$scope.range函数正在创建一个字符串表示为val的新数组，这意味着它只有一个元素（值本身）。相反，尝试：

$scope.range = function(n) {
  return new Array(Number(n));
}

然后，由于您将拥有一组未定义的元素，因此您需要使用track by选项：

<label ng-repeat="i in range(cat.number) track by $index">

或者，保持现有标记，但更改$scope.range以创建递增数字数组：

$scope.range = function(n) {
   return Array.apply(null, {length: n}).map(Number.call, Number);
}

在ng-repeat中使用输入值

1 个答案: