Question

我是棱角分明的新人，我对此事感到困惑。我试图根据数组中的对象填充选择框。我想通过对该阵列使用ng-repeat来选择selectbox ...但是最初我需要在点击add（）之后只显示一个选择框，而下一个selectbox必须来。对于ref：[最初一个选择框必须来]

HTML

<div class="col-lg-12" id="variant1" style="margin-top:10px" ng-repeat="variant in variants">
       <div class="col-lg-4" style="text-align:right;padding-top:2px;padding-right: 20px" >
          <label  for="variant1name">Variant Name</label>
       </div>

       <div class="col-lg-6" >
          <div   >
            <select class="form-control" ng-model="filterFormInputs.apps" ng-options="app.Application for app in variants" >
                <option value="" disabled selected>Select an Application</option> 
             </select>
             <label ng-repeat="checkbox in filterFormInputs.apps.details">
                <input class="ecomtexttype1" type="checkbox" ng-model="checkbox.checked"> {{checkbox.name}}
             </label>                
          </div>
       </div>         
     </div>

控制器：

$scope.variants =
[
    {"Application": "Color", "details":[{"name":"red"},{"name":"blue"},{"name":"black"}]},
    {"Application": "Color", "details":[{"name":"red"},{"name":"blue"},{"name":"black"}]},
    {"Application": "Color", "details":[{"name":"red"},{"name":"blue"},{"name":"black"}]}
]

Answer 1

我认为您可以让add()函数更新数组...如果配置正确，新行应该由于数组上的绑定而呈现。

如评论中所述，您没有提供足够的源代码，因此这里是假设的伪代码：

在html中你可能有

<button ng-click="$scope.add()">Add</button>

所以在控制器中

$scope.variants = [
  // array of whatever you are displaying
  {"foo":"bar1"},
  {"foo":"bar2"}
];

$scope.add = function() {
  variants.push({"foo":"bar_new"});
}

您是否考虑过使用指令？根据您的情况，这可能会更好。请看一下：https://docs.angularjs.org/guide/directive

在ng-repeat中使用ng-options

1 个答案: