2014-09-19 59 views
2

我試圖讓ng-repeat在Angular指令測試中工作,但是當$ scope變量更新並且$ digest()叫做。Angular ng-repeat在茉莉花測試中不起作用

'use strict'; 

describe('Asset tests', function() { 
    var $compile, 
     $rootScope, 
     $scope, 
     $timeout, 
     templateHtml = '<span ng-repeat="asset in assets">{{asset.id}}</span>', 
    view; 

    beforeEach(function() { 
     module('my.module'); 
     inject(function(_$compile_, _$rootScope_, _$timeout_) { 
      $compile = _$compile_; 
      $rootScope = _$rootScope_; 
      $timeout = _$timeout_; 
      $scope = $rootScope.$new(); 

      $scope.assets = []; 
      $scope.selectedItems = []; 
      $scope.deleteAsset = function() { 
       console.log('yay'); 
      }; 
      view = angular.element(templateHtml); 
      $compile(view)($scope); 
      $scope.$apply(); 
     }); 
    }); 

    describe('Testing some stuff', function() { 
     it('should test some stuff', function() { 
      for(var i = 0; i < 3; i ++) { 
       $scope.assets.push({id:i, name: 'Rad ' + i}); 
      }; 
      $scope.$digest(); 
      console.log(view); 
      console.log(jQuery('span').length); 
     }); 
    }); 
}); 

日誌報表輸出:

LOG: {0: <span ng-repeat="assets in assets">{{asset.id}}</span>, length: 1} 
LOG: 56 

回答

2

我不認爲你的HTML模板正確編譯。它說assets in assets,應該是asset in assets。試試看。

另外,我認爲你沒有編譯正確的東西。您正在編譯文本模板,但不是實際的視圖元素。

view = angular.element(templateHtml); 
$compile(view)($scope); 
+0

感謝您指出這些事情。仍然得到相同的結果。請參閱編輯原始代碼。 – binarygiant 2014-09-22 15:21:57

0

這個問題很舊,但我遇到了類似的問題,所以我發佈了什麼爲我工作。 我的問題是在模板中。我需要添加div或其他東西來包裝具有ng-repeat的跨度。在這種情況下更改:

templateHtml = '<span ng-repeat="asset in assets">{{asset.id}}</span>' 

templateHtml = '<div><span ng-repeat="asset in assets">{{asset.id}}</span></div>' 

會做的伎倆。

希望它可以幫助別人。