angularjs如何分别更改两个不同的附加值

时间:2016-01-07 12:08:59

标签: jquery angularjs

我在双向绑定方面存在问题,我想从显示的字段选项中更改每个附加值名称,当我尝试追加另外两个字段时,我无法从显示的单个字段更改每个多个字段,如何抓住那些附加的id到模型?如何更改每个字段名称?我想添加两个人的名字和他们的电子邮件ID ..但当我试图改变这两个名字改变两个字段名称..请解决我这个给我..

您可以在https://jsbin.com/sukibunuwe/edit?html,js,output

中看到

<!DOCTYPE html>
<html ng-app="myapp">

<head>
	<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.0-beta.2/angular.min.js"></script>
	<script src="https://code.angularjs.org/1.5.0-rc.0/angular-sanitize.min.js"></script>
  
</head>

<body ng-controller="AddCtrl">
	<button ng-click="add_NameField($index)">Add Name again</button>
	<button ng-click="add_EmailField($index)">Add Email again</button>

  <div id="drop"></div>

	<form ng-show="showName_Fieldsettings">
		<div class="form-group">
			<label>Field Label(?)</label>
			<br/>
			<input ng-model="field.name">
		</div>
	</form>

	<form ng-show="showEmail_Fieldsettings">
		<div class="form-group">
			<label>Field Label(?)</label>
			<br/>
			<input ng-model="field.email">
		</div>
	</form>

</body>

</html>
ArrayList<Map<String, String>> products = new ArrayList<Map<String, String>>();
while (iterator.hasNext()) {
         Map<String, String> product = new HashMap<String, String>();
         Element currentProduct = iterator.next();
         product.put("id",currentProduct.get("id"));
         product.put("name" , currentProduct.get("name") );
         products.add(product );
}
System.out.println("products : " + products);

1 个答案:

答案 0 :(得分:0)

您有一个包含两个字段的表单,现在添加multiple fields时,更改一个字段值也会更改另一个字段,因为model相同。

<div ng-app>
  <div ng-controller="FormCtrl">
    <div ng-repeat="item in items">
        <input type="text" name="field_name[$index]" placeholder="name" ng-model="item.name">
        <input type="text" name="field_email[$index]" placeholder="email" ng-model="item.email">
      </div>
      <button ng-click="add()">New Item</button>
  </div>
</div>
  

控制器代码:

function FormCtrl($scope) {
  $scope.items = [];

  $scope.add = function () {
     $scope.items.push({ 
       name: "",
       email: ""
     });
  }; 
}

下面是一个简单的小提琴: http://jsfiddle.net/k3p1vxjm/1/