ng-click不工作，試圖替換點擊圖像

我是新的Angular JS，那麼我試圖替換點擊圖像。即，單擊Img1我將用Img1替換先前的圖像，依此類推。ng-click不工作，試圖替換點擊圖像

爲了達到這個目的，我使用了ng-click。事情是即使圖像名稱正在從數據庫檢索。

所以當我這樣做，它不會與工作

<img class="img-responsive" src="images/products/{{oneItem.Image3}}" ng-click="current='{{oneItem.Image3}}'" />

而工作，當我做這個 -

<img class="img-responsive" src="images/products/{{oneItem.Image3}}" ng-click="current='test3.jpg'" />

而且我想這裏 - 更換

<div class="trueimagger"> 
     <img ng-src="WebDrop/images/products/{{ current }}" /> 
</div>

有人可以幫我指出我搞砸了。

請讓我知道是否需要其他信息。 :)

來源

2016-08-21 theLearner

ngClick預計的表達式：

ng-click="current = oneItem.Image3"

您還應該使用ngSrc指令，而不是直接src屬性：

<img class="img-responsive" 
    ng-src="images/products/{{oneItem.Image3}}" 
    ng-click="current = oneItem.Image3" />

來源

2016-08-21 11:39:24 dfsq

它的工作... Brilliant..Who會有thought..Thanks很多好友:) :) :)讓我很快樂.. :) :) – theLearner

無問題，很高興它是有用的。 – dfsq

我會直接改變它的控制器上，因此你可以格式化你的網址不會將邏輯放在視圖上

<!DOCTYPE html> 
<html> 
    <head> 
    <script data-require="[email protected]" data-semver="1.5.8" src="https://opensource.keycdn.com/angularjs/1.5.8/angular.min.js"></script> 
    <script> 
     var app = angular.module('yourApp', []) 
     app.controller('FooCtrl', function($scope) { 
     $scope.imgSrc = 'http://www.freedigitalphotos.net/images/img/homepage/87357.jpg'; 
     $scope.changeSrc = function() { 
      $scope.imgSrc = 'http://assets.barcroftmedia.com.s3-website-eu-west-1.amazonaws.com/assets/images/recent-images-11.jpg'; 
     } 
     }); 

    </script> 
    </head> 
    <body ng-app="yourApp"> 
     <div ng-controller="FooCtrl"> 
     <div class="trueimagger"> 
      <img ng-src="{{ imgSrc }}" /> 
     </div> 
     <button ng-click="changeSrc()">ChangeImgSrc</button> 
     </div> 
    </body> 
</html>

這裏是一個plunker與這個想法

來源

2016-08-21 11:53:14

這是一個好主意，但是我在這裏嘗試製作一個購物網站[鏈接]的類別頁面（https://s13.postimg.org/w4gb7jcef/snap.png）。所以這不能幫助我很多。 :)。謝謝你讓我知道:) – theLearner

你不必寫雙曲花括號{{..}}在ng-click。

相反，簡單的寫：

<img class="img-responsive" 
    src="images/products/{{oneItem.Image3}}" 
    ng-click="current='oneItem.Image3'" />

來源

2016-08-21 12:19:27

ng-click不工作，試圖替換點擊圖像

回答

相關問題