2015-10-20 3 views
8

मेरी AngularJS आवेदन में की एक सरणी की सभी वस्तुओं में एक संपत्ति के मूल्य को अद्यतन करने में ऑब्जेक्ट की श्रृंखला है की जरूरत है:जिन्हें आप नीचे वस्तुओं

$scope.rowData = [{ 
    "expNum": "678",  
    "itemHr": "10", 
    "highRe": "C" 
    }, { 
    "expNum": "978",  
    "itemHr": "3", 
    "highRe": "Y" 
}] 

अब एक क्लिक करें घटना पर मैं अद्यतन करने की आवश्यकता 'itemHr' सरणी में प्रत्येक ऑब्जेक्ट के कुछ नए मान के लिए कहें (25)। मैं ऑब्जेक्ट का नया ऐरे बनाना नहीं चाहता बल्कि मौजूदा केवल संशोधित करना चाहता हूं। अगर हम इसे करने या अंडरस्कोर लाइब्रेरी करने के लिए कोणीय उपयोगिता का उपयोग कर सकते हैं, तो दोनों मेरे लिए ठीक हैं। क्या कोई मेरी यह मदद कर सकता है।

उत्तर

16

वैनिला जेएस लूप के साथ क्यों नहीं?

for(var i = 0; i<$scope.rowData.length; i++) 
{ 
    $scope.rowData[i].itemHr = 25; 
} 

या अंडरस्कोर

_.each($scope.rowData, function(item){ item.itemHr = 25;}); 

या कोणीय

angular.forEach($scope.rowData,function(item){ item.itemHr = 25; }); 

var app = angular.module("myApp", ['ui.bootstrap']); 
 
    
 
    app.controller("maincontroller", function($scope) { 
 
     $scope.rowData = [{ 
 
      "expNum": "678",  
 
      "itemHr": "10", 
 
      "highRe": "C" 
 
      }, { 
 
      "expNum": "978",  
 
      "itemHr": "3", 
 
      "highRe": "Y" 
 
      }]; 
 
     $scope.update = function(){ 
 
      for(var i = 0; i<$scope.rowData.length; i++) 
 
      { 
 
      $scope.rowData[i].itemHr = 25; 
 
      } 
 
      
 
     } 
 

 
    });
<!doctype html> 
 
<html lang="en" ng-app="myApp" ng-controller="maincontroller"> 
 

 
<head> 
 

 
    <meta charset="UTF-8"> 
 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script> 
 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css"> 
 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script> 
 
    <script src="script.js"></script> 
 
    <script data-require="[email protected]" data-semver="0.12.0" src="http://angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.12.0.min.js"></script> 
 
    <link rel="stylesheet" href="style.css" /> 
 
</head> 
 
<body> 
 
    <div> 
 
      <table class="table table-hover table-bordered" > 
 
       <tbody > 
 
        <tr ng-repeat="row in rowData"> 
 
        <td> 
 
         {{row.expNum}} 
 
        </td> 
 
        <td> 
 
         {{row.itemHr}} 
 
        </td> 
 
        <td> 
 
         {{row.highRe}} 
 
        </td> 
 
        </tr> 
 
       </tbody> 
 
      </table> 
 
    </div> 
 
    
 
    <input type="button" class="btn btn-danger" ng-click="update()" value="Update ItemHr to 25"> 
 
</body> 
 
</html>

+0

कोणीय – Artiom

+0

आर्टियॉम के लिए @dboskovic के लिए धन्यवाद, मैंने जवाब स्वीकार कर लिया है लेकिन छोटे नोट, जब मैं item.itemHr = 25 देता हूं, तो यह आइटम नहीं कर रहा है अगर मैं आइटम [itemHr] = 25 देता हूं, तो यह ठीक काम कर रहा है –

+0

@MadasuK पता नहीं क्यों यह आपके लिए काम नहीं किया। नमूना जांचें – Artiom

2
angular.forEach($scope.rowData, function(item,index){ 
    item["itemHr"] = "25"; 
}) 
संबंधित मुद्दे