Question

我正在尝试添加带有覆盖的加载gif图像，而我的angularjs应用程序中的ajax请求正在进行中。每当我尝试加载我的应用程序时，我正在使用自定义指令 - TypeError：elm.show不是函数和TypeError：elm.hide不是函数

＆＃13;

var app = angular.module(moduleName, [HomeModule, CommonModule, SearchModule, AnalyticsModule, 'templatecache']);
        app.config(AppConfig);
        app.directive('loading', ['$http', function ($http) {
            return {
                restrict: 'A',
                link: function ($scope, $elm, $attrs) {
                    $scope.isLoading = function () {
                        return $http.pendingRequests.length > 0;
                    };
                    $scope.$watch($scope.isLoading, function (v) {
                        if (v) {
                            $elm.show();
                        } else {
                            $elm.hide();
                        }
                    });
                }
            };
        }]);

        app.controller('appController', AppController);

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular.min.js"></script>
<body class="container-fluid" id="ng-app">

<div id="wrapper" ng-controller="appController">
    <div class="loading-dialog" data-loading>
    </div>
   <!-- <span us-spinner spinner-key="spinner-comm"></span>-->
    <div class="container-fluid" ng-controller="navTabController">...

＆＃13;

Answer 1

下面的代码代替show（）或hide（）而没有任何错误：

     scope.$watch(scope.isLoading, function (v) {
                        if (v) {
                            elm.css('display', 'block');
                        } else {
                            elm.css('display', 'none');
                        }
                    });

Answer 2

AngularJs使用jqLite作为选择器引擎，似乎他们Array dereferencing支持show/hide功能。为了解决这个问题，您可能应该在头部包含jquery或使用另一种show/hide元素方法。

请注意，如果AngularJs检测到包含jQuery，它将使用jQuery而不是jqLite。

AngularJs自定义指令抛出错误

2 个答案: