錨標記禁用使用ng級和條件

我已經顯示一個表，其中有count coulmn &這個count有<a>標記與href到頁面。我想顯示所有count > 0的鏈接並禁用count=0。錨標記禁用使用ng級和條件

我試過AngularJS - ng-disabled not working for Anchor tag並開始知道使用ng-disabled是沒有用的。

使用ng-class會有所幫助，但我無法在ng-class中指定條件。

P.S.我想要cursor:not-allowed寫在ng-class本身。無法更改CSS

這裏是我的HTML代碼

<tr ng-repeat="service in services"> 
    <td>{{$index+1}}</td> 
    <td>{{service.serviceName}}</td> 
    <td><a href="#/info/{{service.id}}">{{service.numberOfScenarios}}</a></td> 
</tr>

numberOfScenarios顯示count。

來源

2016-07-28 Shabbir Essaji

如果您只想顯示基本信息，請使用ng-show。

如果你想申請任何類使用ng-class。該cursor:not-allowed是CSS，如果你擁有了它的一類已經被ng-class="{'yourclassname':angular-condition}"

應用它，你也可以使用這樣的事情：

<td> 
    <a ng-href="#/info/{{service.id}}" ng-show="service.numberOfScenarios > 0"><span ng-bind="service.numberOfScenarios></span></a> 
</td>

的鏈接將不會顯示service.numberOfScenarios === 0。那麼應該不需要添加CSS。

更新：

<td> 
    <a ng-href="#/info/{{service.id}}" ng-show="service.numberOfScenarios > 0"> 
     <span ng-bind="service.numberOfScenarios"></span> 
    </a> 
    <span ng-show="service.numberOfScenarios === 0" ng-bind="service.numberOfScenarios" style="cursor:not-allowed;"></span> 
</td>

來源

2016-07-28 09:33:14 devjsp

這沒關係。但是我想顯示'0'而沒有任何鏈接。 '計數'值將被顯示 –

這也可以。..謝謝！以上@nitz代碼也工作，但硬編碼不是我正在尋找。 –

我得到了一個十字符號當在0上方盤旋時..所以用@nitz class =「notAllowedClass」並且工作正常。 –

可以直接使用devjsp建議隱藏鏈接。

或者你可以使用這樣的東西。

<a ng-href="count > 0 ? '#/info/{{service.id}}' : ''">Google</a>

更新時間：

<span ng-show="count > 0"> 
    <a href="#/info/{{service.id}}">Link</a> 
</span> 
<span ng-show="count === 0" class="notAllowedClass"> 
    0 <!-- As you suggested in another answer that you want to show 0 count --> 
</span>

來源

2016-07-28 09:50:54 Nitish

對於'count = 0'鏈接將仍然存在..我不想要鏈接本身。 –

是的工作！謝謝.. 我喜歡@devjsp的做法，他沒有硬編碼HTML中的0。但無論如何兩個作品... –

錨標記禁用使用ng級和條件

回答

相關問題