javascript - 如何使用angularjs将多个选定的值分配给文本字段

我有一个来自angularjs发布请求的动态文本字段值。基于响应的文本字段将增加或减少。我想从多个选定的选项字段中编辑该值。

下面给出的HTML代码。

<tr ng-repeat="opt in myData">
     <td>
        <input type="text" id="opt{{$index + 1}}" name="option{{$index + 1}}"   ng-model="opt.options" ng-value="opt.options"  />
     </td>
     </tr>

根据我要更改文本字段值的选择，此处有多个选择选项

首选代码的HTML代码如下

<select ng-model="garden" multiple="multiple">
  <option>Flowers</option>
  <option>Shrubs</option>
  <option>Trees</option>
  <option>Bushes</option>
  <option>Grass</option>
  <option>Dirt</option>
</select>

下面给出第二种选择HTML代码

<select ng-model="country" multiple="multiple">
  <option>USA</option>
  <option>UK</option>
  <option>USR</option>
</select>

请任何人帮助我是Angularjs的新手。谢谢大家

最佳答案

您可以添加ng-change指令以在控制器中相应地选择和更新myData。

<table>
  <tr ng-repeat="opt in myData">
    <td>
      <input type="text" id="{{opt.id}}" name="{{opt.id}}" value="{{opt.value}}" />
    </td>
  </tr>
</table>


<select ng-model="country" multiple="multiple" ng-change="selectChange(country)">
  <option>USA</option>
  <option>UK</option>
  <option>USR</option>
</select>

<select ng-model="garden" multiple="multiple" ng-change="selectChange(garden)">
  <option>Flowers</option>
  <option>Shrubs</option>
  <option>Trees</option>
  <option>Bushes</option>
  <option>Grass</option>
  <option>Dirt</option>
</select>

控制器中的selectChange()

$scope.selectChange = function(val) {
      // selection logic goes here
      $scope.myData = []; // reset selections
      var id = $scope.myData.length;
      angular.forEach(val, function(v, k) { // iterate list and add new selections
        $scope.myData.push({
          'id': id + k,
          'value': v
        });
      });
    };

http://jsfiddle.net/nxjtL7wa/2/