根據同一索引中的另一個字段更新ngRepeat中的字段

我希望能夠在單擊按鈕時使用同一個循環索引內的另一個字段的值填充ng-repeat循環內的文本輸入字段。根據同一索引中的另一個字段更新ngRepeat中的字段

的jsfiddle的是我到目前爲止有：http://jsfiddle.net/3FKMx/

當Copy Names按鈕被點擊我要與在數組中的相同的值來填充每個文本框。目前它使用數組中最後一項的值填充它們。

控制器：

var app = angular.module('myApp', []); 

function someController($scope) { 
    $scope.names = ["name1","name2","name3"]; 

    $scope.copyNames = function() { 
     angular.forEach($scope.names, 
     function (value){ 
      $scope.newName = value; 
     } 
    ); 
    }; 

}

模板：

<div ng-controller="someController"> 
    <button class="btn btn-primary" ng-click="copyNames()">Copy Names</button> 

    <table> 
     <tr ng-repeat="name in names"> 
      <td>{{name}}</td> 

      // I want to populate this input with {{ name }} when I click the button above. 
      <td><input type="text" ng-model="newName"/></td> 
     </tr> 
    </table> 
</div>

來源

2014-03-25 greg

Solution 1

有了一個更新的數據結構，它是通過循環更好一點。

Solution 2

創建一個新的數組來存儲這些值。按鍵設置它們，然後用大括號將它們按鍵查找。

HTML

<div ng-controller="someController"> 
    <button class="btn btn-primary" ng-click="copyNames()">Copy Names</button> 

    <table> 
     <tr ng-repeat="name in names"> 
      <td>{{name}}</td> 
      <td><input type="text" ng-model="models[name]"/></td> 
     </tr> 
    </table> 
</div>

的JavaScript

var app = angular.module('myApp', []); 

function someController($scope) { 
    $scope.names = ["name1","name2","name3"]; 
    $scope.models = {}; 

    $scope.copyNames = function() { 
     angular.forEach($scope.names, 
      function (value, key) { 
       $scope.models[value] = value; 
      } 
     ); 
    }; 
}

來源

2014-03-25 20:32:00

nameItems作爲一個數組來自一個AJAX請求，有沒有必要循環並將其轉換爲一個對象數組呢？ – greg

@greg - 是的，當然。如果你有這個限制，那麼試試這個，我會更新我的答案 - http://jsfiddle.net/3FKMx/3/ –

DEMO（更新你的提琴）是你在找什麼？

$scope.names = [{label: "name1", model: ''}, 
       {label: "name2", model: ''}, 
       {label: "name3", model: ''}]; 


//Also using jQuery.each to break from the loop 
//once we know which value to copy 
$scope.copyNames = function() { 
    $.each($scope.names, 
     function (i, value){ 
      if(value.model) { 
      angular.forEach($scope.names, function(name){ 
       name.model = value.model; 
      }); 

      //Break the loop if done copying 
      return false; 
     } 
     } 
    ); 
};

注：：

使用對象來保持標籤和模型嘗試的jQuery被用作將在角作爲是外部庫。

來源

2014-03-25 20:33:08 dmahapatro

根據同一索引中的另一個字段更新ngRepeat中的字段

回答

相關問題