3

我对 Angular JS 有点陌生,我一直在这里做教程。我被困在第 8 步,当练习是编写一个测试是否显示缩略图图像的测试时。

基本思路是这样的。我们有一个名为phones/nexus-s.json. 进出控制器:

phonecatControllers.controller('PhoneDetailCtrl', ['$scope', '$routeParams', '$http',
function($scope, $routeParams, $http) {
  $http.get('phones/' + $routeParams.phoneId + '.json').success(function(data) {
    $scope.phone = data;
  });
}]);

好的,很好,电话 JSON 对象作为phone. 在我们看来:

<h1>{{phone.name}}</h1>

<p>{{phone.description}}</p>

<ul class="phone-thumbs">
  <li ng-repeat="img in phone.images">
    <img ng-src="{{img}}">
  </li>
</ul>

太好了,我们遍历了所有手机的图片 url。

现在,在测试中,我想检索 的数组phone.images,查看它的长度,并确保li呈现的 html 中的项目数量相同。所以我的测试是:

it('should display the correct thumbnails', function() {
    expect(element(".phone-thumbs li").count()).toBe(repeater('phone.thumbs').length);
});

问题是,我不认为我的部分是正确的,如果可能的话,repeater('phone.thumbs').length我无法找出检索数组的正确方法。phone.thumbs谁能告诉我该怎么做?

我喜欢一个解释,它实际上也解释了这里发生的事情 - 有很多 Future 对象到处跑,老实说,我不确定如何有效地使用它们。

4

2 回答 2

4
it('should display 4 thumbnails', function() {
  var imageList = element.all(by.repeater('img in phone.images'));
  expect(imageList.count()).toBe(4);
});

这对我有用!我刚刚在电话列表视图中注意到,用于过滤列表的测试的代码看起来应该完成相同的事情:

  var phoneList = element.all(by.repeater('phone in phones'));

  expect(phoneList.count()).toBe(20);
于 2014-05-15T20:51:26.777 回答
0

参考最后一个答案,我尝试了它,直到我将 '$ctrl' 包含在内它才起作用。

it('should display 4 thumbnails', function(){
      var imageList = element.all(by.repeater('img in $ctrl.phone.images'));
      expect(imageList.count()).toBe(4);
    });

希望有帮助。

于 2016-08-14T22:29:25.037 回答