Question

我想知道如何在input元素中使用ng-repeat。我有一个select有一些查询option，每当我选择一个查询时，我想检查是否有一个或多个参数需要输入。有些查询需要输入两个参数，如何搜索word参数并根据我找到的结果创建输入。

这是我的选择：

<select ng-model="querySelect" ng-options="item.query as item.queryName for item in queries"></select>

这是我的意见：

<input type="text" ng-show="querySelect.match('parameter')" ng-model="queryParaInput">

我的阵列：

"queries":[
 {"queryName":"View all meals","query":"select * from meal"},
 {"queryName":"Meal price more than","query":"select * from meal where price > parameter"},
 {"queryName":"Meal price between","query":"select * from meal where price  between parameter and parameter"}]

提前致谢。

Answer 1

再添加一个输入框：

<input type="text" ng-show="querySelect.match('between')" ng-model="queryParaInputBetween">

Answer 2

获取数据后，您可以运行一次并创建必要的模型结构。

＆＃13;

angular.module('test', [])

.controller('Test', function($scope) {
  $scope.data = [{
    "queryName": "View all meals",
    "query": "select * from meal"
  }, {
    "queryName": "Meal price more than",
    "query": "select * from meal where price > parameter"
  }, {
    "queryName": "Meal price between",
    "query": "select * from meal where price  between parameter and parameter"
  }];

  angular.forEach($scope.data, function(value) {
    var count = value.query.split('parameter').length - 1; // this is just one of the way of counting how many times 'parameter' has occurred in the string

    value.param = [];
    for (i = 0; i < count; i++) {
      value.param.push(""); // init each parameter's model to empty string
    }
  });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.1/angular.min.js"></script>

<div ng-app='test' ng-controller="Test">
  <div ng-repeat="query in data">
    {{query.query}}
    <div ng-repeat="param in query.param track by $index">
      Param {{$index + 1}}:
      <input type="text" ng-model="param">
    </div>
  </div>
</div>

＆＃13;

AngularJS ng-repeat创建输入

2 个答案: