如何使用Web服务响应中的函数调用ng-disabled

时间:2015-04-16 15:23:19

标签: angularjs angularjs-service angularjs-controller

ng-disabled具有从api和两个参数获取响应的功能。但是在回应后它永远不会被调用。

    function PermissionController(permissionResource) {
    var vm = this;

    vm.message = 'Permission';
    vm.permissions;

    permissionResource.query(function(data) {
        vm.permissions = data;            
    });

    vm.isPermissionMissing = function (r, a) {
                for(var i = 0; i < vm.permissions.length; i++) {
                    if(vm.permissions[i].Resource == r && vm.permissions[i].Action == a)
                        return -1;
                }

                return 1;
            };


}
module.controller("PermissionController", PermissionController);

然后我的视图有一个显示/隐藏ng-disabled的按钮。

 <button type="submit" class="btn btn-primary btn-block" ng-disabled="isPermissionMissing('account', 'search')">Search</button>

然后是一个带有ng-repeat的表

    <table class="table">
    <thead>
        <tr>
            <td>resource</td>
            <td>action</td>
        </tr>
    </thead>
    <tbody>
        <tr ng-repeat="permission in vm.permissions">
            <td>{{ permission.Resource }}</td>
            <td>{{ permission.Action }}</td>
        </tr>
    </tbody>
</table>

问题是在页面加载api响应时,它不会在ng-disabled中调用该函数。

我尝试了承诺然后没有运气。

        permissionResource.query(function(data) {
        vm.permissions = data;            
    }).$promise
        .then(function (result) {
            vm.isPermissionMissing = function (r, a) {
                for(var i = 0; i < result.length; i++) {
                    if(result[i].Resource == r && result[i].Action == a)
                        return -1;
                }

                return 1;
            };
        });

1 个答案:

答案 0 :(得分:0)

angular文档显示ngInit与ngDisabled一起使用。 https://docs.angularjs.org/api/ng/directive/ngDisabled

在你的实例中,我会将函数调用移动到ng-init。然后在函数中,您需要创建一个范围变量来设置true / false。如果这对您有用,请告诉我。

<button type="submit" class="btn btn-primary btn-block" ng-init="isPermissionMissing('account', 'search')" ng-disabled="{{isDisabled}}">Search</button>

vm.isPermissionMissing = function (r, a) {
            for(var i = 0; i < vm.permissions.length; i++) {
                if(vm.permissions[i].Resource == r && vm.permissions[i].Action == a)
                    vm.isDisabled = false;
            }

            vm.isDisabled = true;
        };enter code here