如何使用AngularJS顯示專輯中的所有照片？

我有相冊的AngularJs應用程序，在第一步驟i加載從服務器中的所有照片時，用戶來到網站：如何使用AngularJS顯示專輯中的所有照片？

logicOfMyApp.getPhotosFromServerFunc().then(function (photos) { 
    if (photos.length != 0) { 
     $scope.photosArray = photos; 
     console.log($scope.photosArray); 
    } 
});

在AlbumsPage.html我顯示專輯的名稱和封面：

<div class="col-md-3" ng-repeat="itm in albumsArray"> 
    <a ng-click="followToAlbum(itm.id)" href=""> {{itm.title}}</a><br /> 
    <img ng-src="../Files/{{itm.pathToCover}}" width="250px" height="160px" class="img-rounded" /> 
</div>

點擊專輯的標題後，我發送點擊專輯的ID來followToAlbum(itm.id)方法從哪裏獲得的所有照片和重定向到相冊頁面：

$scope.followToAlbum = function (id) { 
    $scope.AllPhotosOfSingleAlbum = logicOfMyApp.getPhotoOfAlbumFunc($scope.photosArray, id); 
    console.log($scope.AllPhotosOfSingleAlbum); 
    $location.path('/albums/' + id); 
};

我通過ID獲得專輯的所有照片，但它不dipslay。

我在空$ scope.AllPhotosOfSingleAlbum創建即時通訊我的控制器：

$scope.AllPhotosOfSingleAlbum = [];

這裏我的方法的源代碼，在那裏我得到專輯的照片：

getPhotoOfAlbumFunc: function (photosArray, albumIdRoute) { 
     var allPhotosOfAlbum = []; 
     for (var i = 0; i < photosArray.length; i++) { 
      if (photosArray[i].albumId == albumIdRoute) { 
       allPhotosOfAlbum.push(photosArray[i]); 
      } 
     } 

     return allPhotosOfAlbum; 
    }

也許有人知道我如何解決它？謝謝你的回答！

來源

2016-08-02 Uladzimir Khadakouski

試圖通過照片和推（）他們入$範圍創建$ scope.photosArray在你的控制器中的空數組首先然後在回調循環。 photosArray –

@LazyCoder謝謝你的回答，哦，我忘記了..我完成了，我會編輯我的文章，並添加方法，我得到的照片。 –

你只需要爲照片定義一個新的ng-repeat。當AllPhotosOfSingleAlbum更改照片將被打開。

這些添加到您的html代碼：

<div class="col-xs-12 photos-area"> 
    <div class="col-xs-4 photo-area" ng-repeat="photo_item in AllPhotosOfSingleAlbum"> 
     <img ng-src="../Files/{{photo_item.path}}" width="250px" height="160px" class="img-rounded" /> 
    </div> 
</div>

來源

2016-08-02 19:55:50 hurricane

哦，我怎麼可以改變數組？我嘗試使用reverse（）和$ scope.AllPhotosOfSingleAlbum [0] =「」 - 但它沒有幫助。主席先生，你有一個想法，我可以如何改變我的陣列？ –

@VladimirKhodakovskey followToAlbum（）函數是否改變你的數組？ – hurricane

我想是的，http://pastebin.com/7cS6MuMV，我，米改陣。 –

如何使用AngularJS顯示專輯中的所有照片？

回答

相關問題