3

基本上，我有一个输入控制元素，您可以在其中输入您拥有的苹果总数，并根据我想设置的最大迷你苹果派数量来设置您可以制作的迷你苹果派（每 1 个苹果您可以制作 1 个）迷你苹果派）。Angularjs 文档声明使用 ngOptions，但我只想将其基于原始（苹果总数）而不是模型。

所以，如果我的 totalApples 值为 2，那么我希望生成 2 个选项（一个值为 1，另一个值为 2）

到目前为止，我的代码如下：

HTML 片段：

<input ng-model="totalApples" />
<select ng-options="">
  <option value="1">1</option>  //what I would like to have is the options generated 
  <option value="2">2</option>
</select>

在我的控制器中，我设置了范围：

 $scope.totalApples = 2;

谢谢

4

2 回答 2

6

如果您对所选值感兴趣，您应该真正将该ng-options指令与ng-model. 看看这个例子。

此外，不要与检查选项元素时看到的选项值混淆。Angular 确保正确的值绑定到您的模型。

于 2013-04-29T17:33:49.633 回答
3

您可能需要一个自定义函数来为您处理选项的生成。AngularJS 指令处理数据，其余的由你决定。你的目标是提供它。

在您的控制器中

$scope.options = [];
$scope.generateOptions = function() {
  newOptions = [];
  for (var i = 1; i <= $scope.totalApples; i++) {
    newOptions.push(i);
  }
  $scope.options = newOptions;
}

在您的 HTML 中，您可以简单地使用中继器，因为对于这个简单的场景，您实际上并不需要 select 指令。

<input ng-model="totalApples" />
<select>
  <option ng-repeat="option in options" value="{{option}}">{{option}}</option>
</select>
<button ng-click="generateOptions()">Generate options!</button>
于 2013-04-29T17:24:50.517 回答