angularjs - 如何在 angularJs ng-disabled 中使用自定义指令？

Question

我定义了以下指令。

limsApp.directive('isPermissionValid', ['Service', function(Service) {
    return {
        restrict: 'A',
        scope: {
            isPermissionValid: '='
        },
        link: function (scope, elem, attrs) {
           
            if (Service.hasPermissionFor(scope.isPermissionValid)) {
               elem[0].disabled = false;
            } else {
               elem[0].disabled = true;
            }
            
        }
    }
}]);

这是html代码

<input is-permission-valid="['Create/Update']" type="text" id="label" ng-model="test.name">

此文本字段根据条件禁用。

<button is-permission-valid="['Create/Update']" type="button" ng-click="save()" 
ng-disabled="!test.name" >Save</button>

但是当已经禁用了 ng 时，这是行不通的。上面的按钮总是启用的。当我从上面的按钮中删除 ng-disabled 时，当指令为真时它工作正常。那么如何在该元素中已经禁用 ng 时禁用文本字段或按钮。

谢谢你。

Answer 1

无需is-permission-valid在您的场景中创建指令，您可以直接组合逻辑并将其传递给 ng-disabled 属性，例如：

ng-disabled="!test.name || !isPermissionValid"

或者也许 1 个变量来控制就足够了：

HTML：

ng-disabled="shouldDisableButton"

控制器：

$scope.shouldDisableButton = !test.name || !isPermissionValid