收集重復無效

Question

我在“收集重復”中遇到問題。 這是我的控制器代碼：

    .controller('RescheduleCtrl', function($scope){
    this.photos = [];
      for (var i = 0; i < 100; i++) {
        var w = 100 + Math.floor(Math.random() * 200);
        w -= w % 5;
        var h = 150 + Math.floor(Math.random() * 100);
        h -= h % 5;
        this.photos.push({
          width: w,
          height: h,
          src: "1995"
        });
      }


    })

這是視圖文件中的代碼：

 <ion-scroll direction="x" class="available-scroller">
  <div class="photo" collection-repeat="photo in photos"
     item-height="250" item-width="photo.width + 30">
 {{photo.src}}
  </div>
</ion-scroll>

我收到錯誤消息：collection-repeat期望屬性collection-item-width是一個返回數字（以像素為單位）或百分比的表達式。

Answer 1

問題是您沒有在HTML上綁定photos ，而是看着控制器代碼告訴您正在使用controllerAs語法。 因此，如果您有ng-controller="RescheduleCtrl as reschedule"那么您可以將HTML上的photos對象作為reschedule.photos

標記

<ion-scroll direction="x" class="available-scroller">
  <div class="photo" collection-repeat="photo in reschedule.photos"
     item-height="250" item-width="photo.width + 30">
 {{photo.src}}
  </div>
</ion-scroll>

工作碼筆

Answer 2

如果要推送某些內容，則必須添加這些內容-> " "

如此..您的腳本將是這樣的：

.controller('RescheduleCtrl', function($scope){
    this.photos = [];
      for (var i = 0; i < 100; i++) {
        var w = 100 + Math.floor(Math.random() * 200);
        w -= w % 5;
        var h = 150 + Math.floor(Math.random() * 100);
        h -= h % 5;
        this.photos.push({
          "width": w,  /* Here are the edits */
          "height": h,
          "src": "1995"
        });
      }


    })

我希望這對你有用