$ http加载弹出窗口的最佳练习方法
我对Angular很新，但是我想知道A）以下场景是否可行B）有些会导致文档介绍从哪里开始。
场景：目前在我的MEAN应用程序中有一个由jQuery控制的’loading …’弹出窗口，在$ http请求开始时淡入，并在$ http请求成功后淡出。
目标：而不是将jQuery与Angular混合使用我认为使用Angular可能有更好的方法，所以我不会将两者混合在一起。 我还希望能够在显示/隐藏弹出窗口的调用中定义弹出窗口中显示的文本。 即。 “保存新用户……”，“删除用户……”。
这在jQuery中比较直接，但是处理这种情况的最佳实践Angular方法是什么？ 我猜我要创建一个自定义模块？ （也许？）
这里要遵循的几个Angular最佳实践是：
- 使用服务来维护状态和共享数据
- 使用指令进行视图组件封装
- 通过命令式样式脚本避免DOM操作
遵循这些标准的解决方案可能包括……
保存加载状态和消息的值服务
.value('Loading', {message: '', status: false}) 有条件地显示加载消息的指令
JS：
.directive('loading', function(Loading){ return { restrict: 'A', link: function(scope) { scope.loading = Loading; }, template: 'Loading: {{loading.message}} ...' } })
HTML：
用于触发显示指令的$ http拦截器
.config(function($provide, $httpProvider){ $provide.factory('myHttpInterceptor', function($q, Loading) { return { 'request': function(...) { Loading.status = true; ... }, 'response': function(...) { Loading.status = false; ... }, 'responseError': function(...) { Loading.status = false; ... } }; }); $httpProvider.interceptors.push('myHttpInterceptor'); })
在此配置中使用这些组件，只要通过$ http发出请求，就会拦截请求和响应。 根据要求，加载状态指示器将与当前在加载服务中设置为消息的任何内容一起切换。 一旦响应（成功或失败）结算，指示器将被关闭。
在这种情况下，来自控制器的$ http请求的示例看起来如此：
.controller('MyController', function($scope, $http, Loading){ $scope.getSomething = function(){ Loading.message = 'getting something from server'; $http.get('http://filltext.com/?rows=10&delay=3'); }; })
注意：您需要在所有 $ http请求之前设置Loading.message，以避免出现不准确的消息。
演示概念certificate
你需要$ http拦截器 。
此外，还有一个角度加载条模块，您可以在您的应用程序中使用，或者您可以查看github中的代码。