Question

首先，看看我目前的代码：

$scope.disableParticipant = function (memberObj) {
        if($scope.memberObj.membertype==1){
            return true;
        } else if($scope.memberObj.membertype==2 && $scope.program.updatePermission){
            return true;
        }
        return false;
    };

<table>
    <tbody>
    <tr ng-repeat="memberObj in members | orderBy : ['membername'] as resultMem track by memberObj.id">
        <td align="middle" title="Add/Remove Participant" class="width40">
            <input type="checkbox" ng-disabled="disableParticipant(memberObj)">
        </td>
        <td>
            <$ memberObj.membername $>
        </td>
        <td>
            <input type="checkbox" ng-disabled="(disableParticipant(memberObj) && (program.created_by == memberObj.id))">
        </td>
        <td>
            <input type="checkbox" ng-disabled="(disableParticipant(memberObj) && (program.created_by == memberObj.id))">
        </td>
        <td>
            <input type="checkbox" ng-disabled="(disableParticipant(memberObj) && (program.created_by == memberObj.id))">
        </td>
        <td>
            <input type="checkbox" ng-disabled="(disableParticipant(memberObj) && (program.created_by == memberObj.id))">
        </td>
    </tr>
    </tbody>
</table>

我在这里使用了＆＃39; disableParticipant＆＃39;功能多次。我正在寻找任何我不需要再次使用该功能的方式。再次。我认为第一次使用函数时的别名应该可以正常工作，但它不起作用。

<input type="checkbox" ng-disabled="disableParticipant(memberObj) as isDisabled">

＆安培;我希望它像

一样工作

    <td>
        <input type="checkbox" ng-disabled="isDisabled && (program.created_by == memberObj.id))">
    </td>

它没有用，但如果还有其他办法，请告诉我......

Answer 1

在加载members数组

后立即调用此函数

function updateMembersDisability()
{
   $scope.members.forEach(function(member){
       member.isDisabled = false;
       if(member.membertype==1){
            member.isDisabled = true;
        } else if(member.membertype==2 && $scope.program.updatePermission){
            member.isDisabled = true;
        }
   });
}

然后你可以像这样直接使用IsDisabled属性

 <td>
        <input type="checkbox" ng-disabled="memberObj.isDisabled && (program.created_by == memberObj.id))">
    </td>

Answer 2

您可以使用ngInit将函数的结果分配给变量。

<table>
    <tbody>
    <tr ng-repeat="memberObj in members | orderBy : ['membername'] as resultMem track by memberObj.id" 
        ng-init="isDisabled = (disableParticipant(memberObj) && (program.created_by == memberObj.id))">
        <td align="middle" title="Add/Remove Participant" class="width40">
            <input type="checkbox" ng-disabled="disableParticipant(memberObj)">
        </td>
        <td>
            <$ memberObj.membername $>
        </td>
        <td>
            <input type="checkbox" ng-disabled="isDisabled">
        </td>
        <td>
            <input type="checkbox" ng-disabled="isDisabled">
        </td>
        <td>
            <input type="checkbox" ng-disabled="isDisabled">
        </td>
        <td>
            <input type="checkbox" ng-disabled="isDisabled">
        </td>
    </tr>
    </tbody>
</table>

Answer 3

使用as关键字的别名仅适用于controllers 。

但是，您可以使用ng-repeat生成这些复选框，以获得更少的样板。

<tr ng-repeat="memberObj in members | orderBy : ['membername'] as resultMem track by memberObj.id">
    <td align="middle" title="Add/Remove Participant" class="width40">
        <input type="checkbox" ng-disabled="disableParticipant(memberObj)">
    </td>
    <td>
        <$ memberObj.membername $>
    </td>
    <td ng-repeat="i in [1,2,3,4]">
        <input type="checkbox" ng-disabled="disableParticipant(memberObj) && (program.created_by == memberObj.id)">
    </td>
</tr>

Answer 4

在加载成员对象后，添加属性

function updateMembersDisability()
{
    $scope.members.forEach(function(member){
             Object.defineProperty(member, 'isDisabled', {
             get: function() { 
                    if($scope.memberObj.membertype==1){
                         return true;
                    } else if($scope.memberObj.membertype==2 && $scope.program.updatePermission){
                          return true;
                    }
                     return false;
                 }
            });
       });
}

别名是否与ng-disabled中的函数调用一起使用？

4 个答案: