您的代码：

Question

<select>
<option>1</option>
<option selected>2</option>
<option>3</option>
</select>

说我的json中有3个数量，我知道可以使用循环使用jquery但是如何使用ng-repeat of angular来构建我的html？因为它没有[1,2,3]而只有3。

http://jsfiddle.net/qpLuw80j/添加了jsfiddle以示例我的案例更清晰。

Answer 1

将ng-repeat放在选项标签内选项ng-repeat =＆＃34;值中的值＆＃34;

/选项

然后删除剩下的选项

Answer 2

您可以使用此过滤器：

在此处检查您的代码：http://jsfiddle.net/qpLuw80j/2/

过滤器定义为：

var myApp = angular.module('myApp', []);
myApp.filter('range', function() {
  return function(input, total) {
    total = parseInt(total);

    for (var i=1; i<=total; i++) {
      input.push(i);
    }

    return input;
  };
});

使用这样的重复：

<div ng-repeat="n in [] | range:100">
  do something
</div>

您的代码：

HTML：

<div ng-app='app' ng-controller='mainCtrl'>
    <div ng-repeat="json in myJson">
        <li>{{json.name}}</li>
        <select>
        <option ng-repeat="n in [] | range:json.qty" ng-bind="n"></option>
        </select>
    </div>

JS：

var  angular = angular.module('app',['QuickList']);
angular.filter('range', function() {
  return function(input, total) {
    total = parseInt(total);

    for (var i=1; i<=total; i++) {
      input.push(i);
    }

    return input;
  };
});
angular.controller('mainCtrl', function($scope){
    $scope.myJson = [
  {
    "id": "1",
    "name": "banana",
    "price": 12,
    "qty": 3,
  },
  {
    "id": "2",
    "name": "watermelon",
    "price": 12.9,
    "qty": 4,
  }
]

})

Answer 3

您可以使用map向初始数组的每个项目添加数组：

 $scope.myJson.map(function(item) {
    item.qtyArray = [];
    for (var i = 1; i <= item.qty; i++) {
      item.qtyArray.push(i);
    }
    return item;
  })

然后

<select ng-options="item for item in json.qtyArray" ng-model="selected"> </select>

这是updated fiddle。

选项

3 个答案:

您的代码：

HTML：

JS：