ng-if在ng-repeat單擊事件時重新創建元素

我想在用戶單擊它時用img替換錨標籤。我的示例代碼就像ng-if在ng-repeat單擊事件時重新創建元素

<div ng-repeat="postpart in currentPost.parts "> 



    <div ng-if = "!postpart.isclicked"> 
      <img ng-src="{{imgurl}}" ng-click="iclicked(postpart)"/> 
    </div> 

    <div ng-if = "postpart.isclicked"> 
     <a ng-href="{{postpart.description}}" ng-init="init()"></a> 
    </div> 



</div>

iclicked功能只是讓isclicked爲true。

它完美地適用於一個零件。但是當有2個部分時，它顯示2個圖像。當我第一次點擊時，它會被一個錨點元素替換。

但是在第二張圖片的情況下，它會用2個定位標籤代替。

我該如何做到這一點？是否有任何解決方案，以ng-repeat方式替換圖像元素？

來源

2016-02-29 RohanB

你應該嘗試'NG-hide'，'NG-show' –

的是我想更換濾芯.. – RohanB

可以提供http://jsfiddle.net鏈接？ –

可能會幫助你。

var app = angular.module("app",[]); 
 

 
app.controller("ctrl" , function($scope){ 
 
    
 
    $scope.parts = [ 
 
    {"description": "This is a test","isclicked":false,"type":"MEDIA"}, 
 
    {"description": "This is a test2","isclicked":false,"type":"MEDIA"}, 
 
    {"description": "This is a test3","isclicked":false,"type":"MEDIA"}, 
 
    {"description": "This is a test4","isclicked":false,"type":"MEDIA"} 
 
    
 
    ]; 
 
    
 
    $scope.iclicked = function(index){ 
 
    $scope.parts[index].isclicked = !$scope.parts[index].isclicked; 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="app" ng-controller="ctrl"> 
 
    <div ng-repeat="part in parts"> 
 
    <div ng-show = "!part.isclicked"> 
 
     <img src="/images/1.png" ng-click="iclicked($index)"/> 
 
    </div> 
 

 
    <div ng-show = "part.isclicked"> 
 
     <a href="part.description" >{{part.description}}</a> 
 
    </div> 
 
    </div> 
 
</div>

來源

2016-02-29 05:01:10

ng-if在ng-repeat單擊事件時重新創建元素

回答

相關問題