Question

I have an ng-repeat of anchor tags that is displaying a list of clickable group memebers:

<a href="#/contact/{{ ::member.fullProfile.xpid }}" ng-click="storeRecentContact(member.fullProfile.xpid)" class=" GroupRow ListRow ListRow-Contact vmsection ng-class:{'last': $last}" ng-class-odd="'ListRowOdd'" ng-class="{'ListRowLast':$last}" data-ng-repeat="member in group.members | filter: searchFilter() | orderBy: [selectedSort.type, 'fullProfile.displayName'] track by member.xpid" droppable="Call" ng-disabled="member.contactId == myself.contactId">

As you can see at the end of the anchor tag, I am trying to disable 1 of the ng-repeat elements, more specifically, the anchor tag of me/myself.

myself.contactId

and

member.contactId

will be the same on the anchor tag representing my user. However, it is still not disabling my ability to click on my own group member anchor tag. Am I utilizing ng-disabled correctly? Or alternatively, is there another way of accomplishing this?

Answer 1

你无法禁用<a>锚标记，你应该尝试一种更简单的方法来处理html本身的逻辑，使用&&检查，如首先检查member.contactId != myself.contactId，如果它是真的那么只火storeRecentContact(member.fullProfile.xpid)方法。

这里你点击应该看起来像ng-click="member.contactId != myself.contactId && storeRecentContact(member.fullProfile.xpid)"现在你可以删除没有用的ng-disabled指令。

<强>标记

<a href="#/contact/{{ ::member.fullProfile.xpid }}" 
ng-click="member.contactId != myself.contactId && storeRecentContact(member.fullProfile.xpid)" 
...other attributes..
.....
></a>

Small Demo Plunkr

更新

要停止将链接重定向到其他网页，您可以使用ng-attr指令，通过评估href表达式设置{{}}标记值（您要重定向SPA的位置）。如果您想重定向到#/contact/1，那么您的href将为href="#/contact/{{ ::member.fullProfile.xpid }}"，否则只会href=""为空白。假设您使用member.contactId不应等于member.contactId member.contactId != myself.contactId的条件，那么您不希望用户在联系详细信息页面上重定向您的SPA。该事件将由{{member.contactId != myself.contactId' ? #/contact/'+ member.fullProfile.xpid: '' }} ng-attr-href来处理，这将根据href表达式更改{{}}属性值

<a ng-attr-href="{{member.contactId != myself.contactId' ? #/contact/'+ member.fullProfile.xpid: '' }}" 
   ng-click="member.contactId != myself.contactId &&  storeRecentContact(member.fullProfile.xpid)" 
   ...other attributes..
   .....
></a>

Answer 2

ng-disabled创建仅用于输入的disabled属性。

锚标记不是输入，因此无法禁用。您想要做的是改变解决此问题的方式。您可能希望隐藏它（a元素），您可能需要一个指令来删除href或将其替换为＆＃34;＃＆＃34;或根据您的情况。

你也可以这样做：

ng-href="{{getRef(member, mySelf)}}"并从您的控制器计算出来。如果您的条件为假并且应该正常显示，则只需返回正常链接。否则，您可以返回#：

$scope.getRef = function(member, myself) {
    if (member.contactId == myself.contactId) { 
        return "#";
    }
    else {
        return "#/contact/" + member.fullProfile.xpid;
    }
}

Angular: How to disable an anchor tag out of an array (ng-repeat) of anchor tags

2 个答案: