2015-11-05 73 views
0

所以我提到這個鏈接http://demo.jankuri.com/ngGallery/來製作圖像庫。Jankuri ng-gallery沒有錯誤執行後沒有任何顯示

我按照指示做了一切事情,但沒有顯示任何圖像。

這裏是我的控制器

var check123 = function() { 

    for (var i = 0; i < z; i++) { 
     var a = {thumb: '../images/offers/'+'123456789/thumbnails/' + objectidphoto[i], img: '../images/offers/'+'123456789/' + objectidphoto[i]}; 
     arr.push(a); 
    } 
    console.log(arr); 
    console.log(arr[0]); 

} 

這不是我的完整控制器只顯著部分。

這是我的前端代碼

<body ng-app="fileUpload" ng-controller="MyCtrl"> 
<div> 
    <div class="content"> 
     <ng-gallery images="MyCtrl.arr"></ng-gallery> 
    </div> 
</div> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script> 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular.js"></script> 
<script src="controller14.js"></script> 
<script src="ng-infinite-scroll.js"></script> 
<script src="ng-infinite-scroll.min.js"></script> 
<script type="text/javascript" src="src/js/ngGallery.js"></script> 

</body> 

角代碼執行沒有任何錯誤,我得到的回報爲執行console.log(ARR)適當的反應。

我在做什麼錯?

更新的分段

控制器

var app = angular.module('fileUpload', ['jkuri.gallery']). 
    controller('MyCtrl', function($scope, $document) 
    { 
     var self = this; 
     self.images = [ 
      {thumb: 'images/offers/'+'123456789/thumbnails/' + '1445524452873_491676259.jpg', img: '../images/offers/'+'123456789/' + '1445524452873_491676259.jpg'}, 
      {thumb: 'images/offers/'+'123456789/thumbnails/' + '1445524894340_7a668c73cddcd2050821f83be901832a_1426070017.jpg', img: '../images/offers/'+'123456789/' + '1445524894340_7a668c73cddcd2050821f83be901832a_1426070017.jpg'} 

     ]; 
    }); 

HTML

<body ng-app="fileUpload" ng-controller="MyCtrl"> 
<div> 
     <ng-gallery images="MyCtrl.images"></ng-gallery> 

</div> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script> 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular.js"></script> 
<script src="controller14.js"></script> 
<script src="ng-infinite-scroll.js"></script> 
<script src="ng-infinite-scroll.min.js"></script> 
<script type="text/javascript" src="src/js/ngGallery.js"></script> 

</body> 

現在我已經完全複製模塊的演示是什麼樣子。問題仍然存在。前端沒有變化。

回答

2

您可以參考Myctrl.arr,您不需要在控制器名稱的前面加上前綴。只要arr應該工作,也就是說,如果你正確地將arr分配給範圍。 $ scope.arr.push ...

我打算猜測你是不是在做上述事情。

UDATED:

你的控制器:

var app = angular.module('fileUpload', ['jkuri.gallery']). controller('MyCtrl', function($scope, $document) { $scope.images = [ {thumb: 'images/offers/'+'123456789/thumbnails/' + '1445524452873_491676259.jpg', img: '../images/offers/'+'123456789/' + '1445524452873_491676259.jpg'}, {thumb: 'images/offers/'+'123456789/thumbnails/' + '1445524894340_7a668c73cddcd2050821f83be901832a_1426070017.jpg', img: '../images/offers/'+'123456789/' + '1445524894340_7a668c73cddcd2050821f83be901832a_1426070017.jpg'} ]; }); 

你的HTML

<body ng-app="fileUpload" ng-controller="MyCtrl"> <div> <ng-gallery images="images"></ng-gallery> </div> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular.js"></script> <script src="controller14.js"></script> <script src="ng-infinite-scroll.js"></script> <script src="ng-infinite-scroll.min.js"></script> <script type="text/javascript" src="src/js/ngGallery.js"></script> </body> 

注意$範圍分配和缺乏控制的名字。

+0

謝謝你。該模塊充滿了錯誤,沒有箭頭或關閉水印在那裏可見+我希望我可以添加一個按鈕或其他東西。 –

相關問題