2013-07-09 11 views
5

में 2 डी सरणी $ इंडेक्स मैं एक कोणीय जेएस ऐप पर काम कर रहा हूं जो ng-repeat फ़ंक्शन द्वारा निर्मित 2 डी सरणी से स्प्रेडशीट बनाता है। मैं वर्तमान में एक फ़ंक्शन लिख रहा हूं जो सरणी के प्रारंभिक मानों को बदल देगा जब उपयोगकर्ता स्प्रेडशीट पर नए मान डालता है। इसके लिए मुझे अपनी पंक्ति अनुक्रमणिका और कॉलम इंडेक्स के आधार पर प्रारंभिक सरणी में बिंदु तक पहुंचने की आवश्यकता है ताकि मैं इसे नए मान में बदल सकूं।एंगुलरजेएस

मैंने ng-repeat API पर देखा है और पाया है कि इसमें $index संपत्ति है जो मुझे वर्तमान दोहराए गए मान की अनुक्रमणिका की जांच करने की अनुमति देती है। हालांकि, मैं यह केवल मुझे जो कुछ भी दोहराने पाश आप अंदर हैं के मूल्य के सूचकांक की जाँच करने देगा कि लग रहा है -। कोई अन्य बाहर छोरों है कि आप भी में हो सकता है

<script> 

    data = [ 
      [A1, B1, C1], 
      [A2, B2, C2], 
      [A3, B3, C3] 
      ] 

    sheet= function($scope, $parse){ 
    $scope.columns = [colA, colB, colC]; 
    $scope.rows = data.length; 
    $scope.cells = {}; 
    $scope.outer = data.map(function(c,row){ 
     return c.map(function(data, ind){ 
      return { 
       content: data, 
       model: null, 
      }; 
     }); 
    }); 
    }; 
</script> 


<div ng-app ng-controller="sheet"> 
    <table> 
     <tr class="column-label"> 
      <td ng-repeat="column in columns">{{column}}</td> 
     <tr ng-repeat="inner in outer"> 
      <td class="row-label" ng-repeat="data in inner"> 
       <div> 
        <input type="text" ng-model="data.content" value="{{data.content}}"> 
       </div> 
      </td> 
     </tr> 
    </table> 
</div> 

मैं $index उपयोग करना चाहते outer के inner लूप के भीतर, और inner के $index तक पहुंचने में भी सक्षम हो सकते हैं। क्या ऐसा करने का कोई तरीका है? मैं इन मानों को उस कार्य के पैरामीटर के रूप में पास करने की योजना बना रहा हूं जो मैं लिख रहा हूं।

+0

शायद एक और सीधा-आगे जवाब है, लेकिन मैं संभवतः बस एस होगा एनजी-दोहराव की जांच करना, शायद आप केवल अपना निर्देश लिख सकते हैं जो विशेष रूप से आपके लिए इस मामले को संभालता है। हालांकि एक अच्छा सवाल है। – shaunhusain

+2

'$ माता-पिता। $ अनुक्रमणिका' या शायद' $ माता-पिता()। $ अनुक्रमणिका' - इन दोनों में से एक को काम करना चाहिए। – rGil

+0

'$ पेरेंट। $ अनुक्रमणिका' काम करता है। धन्यवाद! – user2494584

उत्तर

10

Haha, ठीक है, यह टिप्पणी में जवाब दिया गया था, जबकि मैं एक साथ मेरी बेला डाल रहा था, लेकिन यहां सड़क के नीचे इस सवाल खोजने लोगों के लिए यह का एक प्रदर्शन है:

http://jsfiddle.net/V8qzt/1/

<div ng-controller="MyCtrl"> 
    <table> 
     <tr ng-repeat="row in data"> 
     <td ng-repeat="cell in row"> 
      {{cell}} ({{$index}},{{$parent.$index}}) 
      </td> 
     </tr> 
    </table> 
</div> 
+0

मुझे 'दोहराने वाले में डुप्लिकेट की अनुमति नहीं है' –

+1

'ट्रैक द्वारा $ इंडेक्स' जोड़कर हल किया गया है (http://stackoverflow.com/questions/16296670/angular-ng-repeat-error-duplicates-in- एक-पुनरावर्तक-नहीं-अनुमति दी जाती है) –

0

यहाँ मेरा कोड है, हो सकता है कि यह आपको या किसी ऐसे व्यक्ति की मदद करेगा जो लूप 2 डी सरणी को दो एनजी-दोहराने वाले तत्व में ढूंढने का तरीका ढूंढ सके। एचटीएमएल कोड

<div ng-repeat="row in gameMatrix track by $index"> 
    <div id=cell_{{row.id}}> 
    </div> 
</div> 

Javascript कोड:

$scope.gameData = [ 
    [1, 0, 0], 
    [1, 0, 0], 
    [1, 0, 0], 
    [1, 0, 0] 
]; 

$scope.presentCellsData = function() { 
    var Str = ""; 
    var rows = []; 
    var term = []; 
    for (i = 0; i < $scope.gameData.length; i++) { 
     Str = ""; 
     rows = ""; 
     for (j = 0; j < $scope.gameData[i].length; j++) { 
      console.log("i j " + i + " " + j); 
      console.log($scope.gameData[i][j]); 
      Str = "<div style='display:inline-block'> " + $scope.gameData[i][j] + "&nbsp;</div>"; 
      rows += Str; 
     } 
     rows += "</br>"; 
     term.push({ "id": i, "data": rows }); 
    } 
    console.log(term); 
    return term; 
} 

$scope.gameMatrix = $scope.presentCellsData(); 
angular.element(document).ready(function() { 
    for (i = 0; i < $scope.gameMatrix.length; i++) { 
     console.log("$scope.gameMatrix[i]"); 
     console.log($scope.gameMatrix[i]); 
     document.getElementById("cell_" + i).outerHTML = $scope.gameMatrix[i].data; 
    } 
}); 

@Karen: धन्यवाद आप, मैं अपने डेटा के साथ कि रास्ते में अपने कोड का उपयोग कर सकते हैं:

<div style="display: inline-block;" ng-repeat="row in gameData track by $index"> 
     <!-- <div id=cell_{{row.id}}> 
      aaa 
     </div> --> 
     <div ng-repeat="cell in row track by $index"> 
      {{cell}} 
     </div> 
    </div>