AngularJS ng-repeat ng-click

我想要一個網格圖像，點擊時圖像隱藏在網格中，並顯示在頂部。AngularJS ng-repeat ng-click

HTML：

<div ng-controller="imageCtrl"> 
     <div class="row"> 
     <img ng-show="selected" src="{{selected.img}}" alt=""> 
     <p ng-show="selected">{{selected.des}}</p> 
     </div> 
     <div class="row"> 
     <div ng-repeat="(id, image) in images" class="col-sm-4"> 
      <a ng-click="clicked(id)"><img src="{{image.img}}" alt=""></a> 
     </div> 
     </div> 
    </div>

而且我的控制器：

light.controller('imageCtrl', function($scope){ 
    $scope.images = [{img: '',des: ''},{img: '',des: ''},{img: '',des: ''}]; 
    $scope.selected = $scope.images[0]; 
    $scope.clicked = function(id){ 
    selected = $scope.images[id]; 
};

}）;

當前顯示第一個圖像，但是當我點擊其他圖像時沒有任何反應。任何人有任何提示，我做錯了什麼？謝謝！

來源

2014-05-09 user3621884

我不認爲你可以在'ng-repeat'的z'語法中使用'（x，y） - 而只需要在圖像中使用'ng-repeat ='圖像''，然後使用'$ index'變量，在'ng-repeat'中可用，作爲你當前'id'的替代。 – jraede

我在ng-click =「clicked（$ index）」中使用$ index還是用在我的函數中？ – user3621884

使用'clicked（$ index）'，在你的函數中你可以保持'id'原樣。 – jraede

-1

使用這個代替：

<img ng-show="selected" ng-src="{{selected.img}}" alt="">

使用NG-SRC = {{selected.image}}在圖像標籤，而不是僅僅SRC = {{selected.image}}。角就會知道它需要如果模型的指向已更新

來源

2014-05-09 21:15:07 TyndieRock

完全無關的問題... – gkalpak

感謝您的提示，但仍然沒有運氣... – user3621884

任何想法ExpertSys？ – user3621884

更新圖像，您需要設置$scope.selected不selected

$scope.clicked = function(id){ 
    $scope.selected = $scope.images[id]; 
}

編輯：我吮吸plunker;）

反正：採用NG-重複，你在你的第一個例子一樣，它應該工作

<div ng-repeat="(id, image) in images" class="col-sm-4"> 
    <a ng-click="clicked(id)"><img src="{{image.img}}" alt=""></a> 
</div>

來源

2014-05-09 21:21:04 nilsK

還有沒有其他想法？我很難過。 – user3621884

你確定嗎？它似乎也適用於我！ – gkalpak

我不明白這個例子... – gkalpak

試試這個：

在HTML中，而不是傳遞ID傳遞的索引值作爲

納克單擊= 「點擊（$索引）」

在控制器中，

$scope.clicked = function(Index){ 
$scope.selected = $scope.images[Index];

};

來源

2014-06-18 08:42:01

AngularJS ng-repeat ng-click

回答

相關問題