如何将ng-options更改为ng-repeat?

时间:2016-01-07 04:31:59

标签: javascript angularjs

我是AngularJS的初学者,我正在构建简单的应用程序,但我遇到了问题

这是我的Html

<div ng-app="MyApp">
  <div ng-controller="TabsDemoCtrl">
    <div ng-controller="TabsDemoCtrl">      
      <label>Category</label>
      <select class="form-control" ng-model="product.category" ng-options="category as category.name for category in categories"></select>    
    </div>

    <label>how to change ng-options to be ng-repeat ?my achieve is to be like this</label>
    <input type="text" class="form-control" value="custom">
    <input type="text" class="form-control" value="non-custom">
  </div>
</div>

这是我的Js

angular.module('MyApp', [
    'ui.bootstrap']);

(function(MyApp) {
  'use strict';
  MyApp.controller('TabsDemoCtrl', ['$scope', function($scope) {
    // categories
    $scope.categories = [
      {
        name:'custom', 
        templateAttribute: [
          {attribute: 'material'},
          {attribute: 'soles'},
          {attribute: 'size'}
        ]
      },
      {
        name:'non-custom', 
        templateAttribute: [
          {attribute: 'material'},
          {attribute: 'soles'},
          {attribute: 'size'}
        ]
      }
    ];     
  }]);
})(angular.module('MyApp'));

这是我的简单demo

如何输出ng-option上的数据作为重复表单文本?谢谢提前

3 个答案:

答案 0 :(得分:1)

我也是Angular的新手,但这最近几天对我有用。

<div ng-controller="TabsDemoCtrl">      
    <label>Category</label>
    <select class="form-control" > 
        <option ng-repeat="category in categories">{{category.name}}</option> 
    </select>    
</div>

答案 1 :(得分:0)

试试这个

<div ng-repeat="category in categories">
    <input type="text" class="form-control" ng-model="category.name">
</div>

DEMO

答案 2 :(得分:0)

试试这个。这可能会对你有所帮助

<select ng-options="catagory.name as catagory.name for catagory in categories" ng-model="categoryName"class="form-control" name="categoryName">  
<option value="">Select Category</option>
</select>