2014-05-13 58 views
1

我想使用AngularJs來創建一些div結構,但它根本不起作用。 我該如何使用範圍?AngularJS ng-repeat創建div

<div ng-controller = "gameController"> 
    <div class="table"> 
     <div ng-repeat = "i in [] | range:game.nrLines"> 
      <div class="trow"> 
       <div ng-repeat = "j in [] | range:game.nrCols"> 
        <span class="element"> 
         <img src="img/elep.png" class="element" data-col = {{j}} data-line= {{i}}> 
        </span> 
       </div> 
      </div> 
     </div> 
    </div> 
</div> 

這裏是角碼:

var gameApp = angular.module("gameApp", []); 
gameApp.filter('range', function() { 
    return function(input) { 
     for (var i=0; i<input; i++) { 
      input.push(i);   
     } 
     return input; 
    } 
}); 

gameApp.controller("gameController", function($scope) { 
    $scope.game = new Game(); 
    $scope.nrCols = $scope.game.matrix.getNrCols; 
    $scope.nrLines = $scope.game.matrix.getNrLines; 
}); 

謝謝!

回答

3

您的過濾器缺少範圍的參數。輸入你要去從過濾器返回的東西,所以你只需要添加另一個參數爲實際計數:

gameApp.filter('range', function() { 
    return function(input, count) { 
     for (var i=0; i<count; i++) 
      input.push(i);   
     return input; 
    } 
}); 

我做了一個plnkr here幫助

+0

非常感謝!有用 ! – user3009269

+0

不要忘了標記它是正確的 – mbroadst