Question

您好我的范围名为loadingdata的变量。它将具有值true或false以确定数据是否正在加载。我想在元素上放置一个属性，以便在加载数据时禁用它。这是我已有的代码，但它无法正常工作：

module.directive('disableWhenLoadingData', function () {
            return {
                restrict: 'A',
                scope: {},
                link: function ($scope, element, attrs) {
                    $scope.$watch('loadingData', function(newValue, oldValue) {
                        element.attr('disabled', newValue);
                    });
                }
            };
        });

任何想法

Answer 1

您可以使用Angular自己的ngDisabled指令，而不是自己编写。

Answer 2

服务：

module.factory('GetDataService', function ($http) {
    return {
        getCustomers: function() {
            return $http({ url: '/someurl', method: 'GET'});
        }
    }
});

指令：

 module.directive('disableWhenLoadingData', function (GetDataService) {
        return {
            restrict: 'A',
            scope: {},
            link: function ($scope, element, attrs) {
                $scope.loadingData = true;
                GetDataService.getCustomers().success(function (data) {
                    $scope.loadingData = false;
                });
            }
        };
    });

Answer 3

通常我在我的控制器中设置$ scope.loading，我的按钮或我设置的任何禁用。

在我的控制器中：

$scope.loadData = function () {
    $scope.loading = true;
    $http
        .get('url')
            .success(function (ret) {
                $scope.loading = false;
            });
}

在我看来：

<button ng-disabled="loading" ng-click="loadData()">{{loading? 'loading Data' : 'Submit'}}</button>

如何在加载指令时实现禁用

3 个答案: