如何使用if語句將圖像添加到表格中？

我得到了這樣的事情：如何使用if語句將圖像添加到表格中？

<tr bgcolor="lightgrey"> 
    <th>ID</th> 
    <th>Name</th> 
</tr> 
<tr ng-repeat="s in schools| filter:searchField | orderBy:'schoolId'" 
    ng-click="selectSchool(s, $index)" 
    ng-class="getSelectedClass(s)"> 
    <td>{{s.schoolId}}</td> 
    <td>{{s.schoolName}}</td> 
</tr>

好了，現在學校有一個int參數，現在我想一個簡單的圖像（綠和/或紅點）添加到我的表...但如果參數是0，它應該是紅色的點，否則它應該是綠色的...

所以有可能以某種方式做一個if語句的角度？如果是的話，我需要它是可點擊的，所以一旦我按紅點，它應該變成綠色，反之亦然。

來源

2016-12-19 newbie

放在什麼地方的形象呢？ – azad

我在項目中有我的圖片，網頁內容，圖片 – newbie

Use ng-if="parameter === 0" 

    <img> red dot image 

ng-if="parameter!==0" 

    <img> green dot image

或者你也可以這樣做

<img ng-src="{{parameter===0?'reddotsrc' : 'greendotsrc'}}" ng-click="parameter!=parameter">

如果參數爲0，那麼它切換1，如果1，那麼爲0。

來源

2016-12-19 12:54:25

如果需要點擊，請添加一個帶有函數的ng-click指令，以在值'reddotsrc'和'greendotsrc'之間切換。 –

當我這樣做時它不顯示圖像 – newbie

檢查您提供的圖像的路徑。還要檢查網絡中呼叫報頭中的網址以驗證它是否指向所需的位置。另外用「s.timerPeriod.timerRepeat」 –

可以使用NG-顯示：

HTML：

<div ng-app> 
    <div ng-controller="TodoCtrl"> 
     <table> 
     <tr ng-repeat = "data in comments"> 
     <td>{{data.type}}, {{data.type == 1}}</td> 

      <td ng-show="data.type == 1 "> 
      <img style="height:10px; width:10px; padding:5px;" src="http://greensportsalliance.org/images/darkGreenSquare.gif"> 
      </td> 
      <td ng-show="data.type == 0 "> 
       <img style="height:10px; width:10px; padding:5px;" src="http://cdn.playbuzz.com/cdn/04854427-89c9-48dc-bb5b-9705e0a298b5/6cb7bccb-3dcd-4af2-8da8-8c6260f2f934.jpg"> 
      </td> 
     </tr> 

    </table> 
    </div> 
</div>

Javasc RIPT：

function TodoCtrl($scope) { 

    $scope.comments = [ 
     {type:1},{type:0},{type:0},{type:1} 
    ] 
}

Working example

來源

2016-12-19 13:01:45

更改「參數」在這種情況下，'ng-if'優於'ng-show'。 – Mistalis

@Mistalis：是啊，我剛剛用ng-show試過，ng-if在這種情況下效果更好 –

這可能會幫助你

<tr bgcolor="lightgrey"> 
    <th>ID</th> 
    <th>Name</th> 
</tr> 
<tr ng-repeat="s in schools| filter:searchField | orderBy:'schoolId'" 
    ng-click="selectSchool(s, $index)" 
    ng-class="getSelectedClass(s)"> 
    <td ng-if="s.parameter == 0"><img src='reddot.png' ng-click="s.parameter = 1"></td> 
    <td ng-if="s.parameter != 0"><img src='greendot.png' ng-click="s.parameter = 0"></td> 
    <td>{{s.schoolId}}</td> 
    <td>{{s.schoolName}}</td> 
</tr>

來源

2016-12-19 13:03:15 azad

幫助我thx男人 – newbie

如何使用if語句將圖像添加到表格中？

回答

相關問題