如何显示角度工厂的dom

Question

我想显示一个带有工厂微调器图像的 dom，我尝试使用 jquery，$rootScope 来显示 dom，但没有成功，

下面是我的工厂代码，

.factory('api', function($q, $http, $state, $timeout, $rootScope, $window) {
    var request = function(callback, timeout) {
      var deferred = $q.defer();

      $timeout(function() {
        deferred.resolve(null);
      }, typeof timeout !== 'undefined' ? timeout : 800);

      callback(deferred);

      return deferred.promise;
    };

    return {
      postData: postData
    };

    function postData(data) {
      var $ = angular.element;
      $.sg= true;
      return $http.post('/a/', data).then(function(response) {
          $timeout(function () {window.location.href = "/bdc";}, 10000)
        }
      })
    }
  })

Answer 1

我认为您的意图是为您的应用程序中的所有 Http 请求显示spinner。我使用的是angular-block-ui 模块。

http://angular-block-ui.nullest.com/#!/examples/documentation

从工厂访问一些 DOM 元素也不是一个好主意。 Factory 旨在做一些可重用的代码，这些代码可以注入到您的控制器、指令等中。

自动拦截

默认情况下，BlockUI 模块会在 Angular 启动时启动一个块 $http 服务有一个待处理的请求。如果你不想要这种行为 并且想要手动执行所有阻止，您可以将此值更改为 假的。

// Disable automatically blocking of the user interface
blockUIConfig.autoBlock = false;

如果您不想为所有请求显示它，请使用block-ui 中的requestFilter 选项来过滤您的请求。

如果您选择手动阻止，请使用start() 和stop() 方法来显示和隐藏阻止。

<div block-ui="myBlockUI">
  <p> ... I'm blockable ... </p>
</div>

block-ui 指令采用可选值，可用于 获取关联的 blockUI 服务的实例。

// Get the reference to the block service.
var myBlockUI = blockUI.instances.get('myBlockUI');

// Start blocking the element.
myBlockUI.start();

$timeout(function() {
  // Stop the block after some async operation.
  myBlockUI.stop();
}, 1000);

上述阻塞预计由控制器而不是工厂完成。

手动拦截示例：http://plnkr.co/edit/qflWqd?p=preview

自动屏蔽示例：http://embed.plnkr.co/NqyunD/