如何自动跟踪 angularjs 自动补全.js 的异常

使用angularjs的但页面应用时,由于是本地路由在控制页面跳转,但是有的时候我们需要判断用户是否登录来判断用户是否能进入界面。
angularjs是mvc架构所以实现起来很容易也很灵活,我们只MainController里增加一个路由事件侦听并判断,这样就可以避免未登录用户直接输入路由地址来跳转到登录界面地址了
代码中的 $rootScope.user是登录后把用户信息放到了全局rootScope上,方便其他地方使用,$rootScope.defaultPage也是默认主页面,初始化的时候写死到rootScope里的。
12345678$rootScope.$on(&$stateChangeStart&,function(event, toState, toParams, fromState, fromParams){ if(toState.name==&login&)// 如果是进入登录界面则允许 // 如果用户不存在 if(!$rootScope.user || !$rootScope.user.token){
event.preventDefault();// 取消默认跳转行为
$state.go(&login&,{from:fromState.name,w:&notLogin&});//跳转到登录界面 }});
另外还有用户已经登录,但是登录超时了,还有就是增加后台接口的判断来增强安全性。不能完全依靠本地逻辑
我们在model里面增加一个用户拦截器,在rensponseError中判断错误码,抛出事件让Contoller或view来处理1234567891011121314151617181920212223app.factory(&UserInterceptor&, [&$q&,&$rootScope&,function ($q,$rootScope) { return {
request:function(config){
config.headers[&TOKEN&] = $rootScope.user.
responseError: function (response) {
var data = response.
// 判断错误码,如果是未登录
if(data[&errorCode&] == &500999&){
// 清空用户本地token存储的信息,如果
$rootScope.user = {token:&&};
// 全局事件,方便其他view获取该事件,并给以相应的提示或处理
$rootScope.$emit(&userIntercepted&,&notLogin&,response);
// 如果是登录超时
if(data[&errorCode&] == &500998&){
$rootScope.$emit(&userIntercepted&,&sessionOut&,response);
return $q.reject(response);
};}]);
别忘了要注册拦截器到angularjs的config中哦
123app.config(function ($httpProvider) {
$httpProvider.interceptors.push(&UserInterceptor&);});
最后在controller中处理错误事件1234$rootScope.$on(&userIntercepted&,function(errorType){ // 跳转到登录界面,这里我记录了一个from,这样可以在登录后自动跳转到未登录之前的那个界面 $state.go(&login&,{from:$state.current.name,w:errorType});});
最后还可以在loginController中做更多的细节处理
12345// 如果用户已经登录了,则立即跳转到一个默认主页上去,无需再登录if($rootScope.user.token){ $state.go($rootScope.defaultPage); }
另外在登录成功回调后还可以跳转到上一次界面,也就是上面记录的from12var from = $stateParams[&from&];$state.go(from && from != &login& ? from : $rootScope.defaultPage);
此文是本站原创,转载请标注作者和链接出处!
1219241121111编程开发子分类&iframe id="myFrame" ng-src="{{url}}" width="100%" height="100%" seamless frameborder="0" &&/iframe&打开不同域的内容时报下面的错误:Blocked loading resource from url not allowed by $sceDelegate policy解决方案:app.config(function($sceDelegateProvider) {
$sceDelegateProvider.resourceUrlWhitelist([
// Allow same origin resource loads.
// Allow loading from our assets domain.
Notice the difference between * and **.
'http://media.w3.org/**']);
});很简单的方法就解决了angularjs跨域使用iframe的问题,希望大家能够喜欢
这是我的文章签名,在自己的文章底部展示,支持UBB标签,自动识别URL 你也可以设置自己的文章签名哦,
如果您想留下此文,您可以将其发送至您的邮箱(将同时以邮件内容&PDF形式发送)
相关文章推荐
(Ctrl+Enter提交) &&
已有0人在此发表见解
&在& 00:00收藏到了
&&在信息爆炸的时代,您的知识需要整理,沉淀,积累!Lai18为您提供一个简单实用的文章整理收藏工具,在这里您可以收藏对您有用的技术文章,自由分门别类,在整理的过程中,用心梳理自己的知识!相信,用不了多久,您收藏整理的文章将是您一生的知识宝库!
· 蜀ICP备号-1AngularJS诞生于Google是一款优秀的前端JS框架,已经被用于Google的多款产品当中。AngularJS有着诸多特性,最为核心的是:MVC、模块化、自动化双向数据绑定、语义化标签、依赖注入,等等。
本文为大家介绍的是AngularJS表达式操作方法,AngularJS表达式类似Javascript的代码片段,通常在数据绑定中用到,写在双大括号中,如:{{表达式}}。表达式是用$parse方法来处理的。感兴趣的同学参考下。
下面是一些合法的AngularJS表达式
3*10 | currency
你可能会认为AngularJS视图中的表达式就是Javascript表达式,这种认识不完全对,因为AngularJS不会用Javascript的eval()函数去执行表达式。 不过除了以下几个需要区别的地方以外,你可以把AngularJS表达式看成是Javascript表达式:&
属性表达式:属性表达式对应于当前的作用域,不像Javascript对应的是全局的window对象。
允许未定义值:执行表达式时,AngularJS能够允许undefined或者null,不像Javascript会抛出一个异常。
没有控制结构: 你不能在AngularJS表达式中使用&条件判断&、&循环&、&抛出异常&等控制结构。
过滤器(类似unix中的管道操作符): 你可以通过过滤器链来传递表达式的结果。例如将日期对象转变成指定的阅读友好的格式。
如果你想要在表达式中使用标准的Javascript,那么你应该把它写成一个控制器的方法,然后在表达式中调用这个方法。如果你想在Javascript中执行AngularJS表达式,你可以使用$eval()方法。
举个例子:
&!doctype html&
&html ng-app&
&script src="http://code.angularjs.org/angular-1.0.2.min.js"&&/script&
  function Cntl2($scope) {
      var exprs = $scope.exprs = [];
      $scope.expr = '3*10|currency';
      $scope.addExp = function(expr) {
//在控制器里面定义了一个addExp方法,在这个方法中,使用的是标准的js代码
        exprs.push(expr);
      };
      $scope.removeExp = function(index) {
        exprs.splice(index, 1);
      };
&div ng-controller="Cntl2" class="expressions"&
Expression:
&input type='text' ng-model="expr" size="80"/&
&button ng-click="addExp(expr)"&Evaluate&/button&
&li ng-repeat="expr in exprs"&
[ &a href="" ng-click="removeExp($index)"&X&/a& ]
&tt&{{expr}}&/tt& =& &span ng-bind="$parent.$eval(expr)"&&/span&
//这里的expr是在js中,如果想运行此angular表达式,就调用$eval。
属性表达式
属性表达式计算是发生在作用域中的。Javascript默认是以window为作用域的。AngularJS要使用window作用域的话得用$window来指向全局window对象。 比如说,你使用window中定义的alert()方法,在AngularJS表达式中必须写成$window.alert()才行。
示例代码:
&!doctype html&
&html ng-app&
&script src="http://code.angularjs.org/angular-1.0.2.min.js"&&/script&
function Cntl1($window, $scope){
      $scope.name = 'World';
      $scope.greet = function() {
        ($window.mockWindow || $window).alert('Hello ' + $scope.name);
      }
&div class="example2" ng-controller="Cntl1"&
Name: &input ng-model="name" type="text"/&
&button ng-click="greet()"&Greet&/button&
允许未定义值
表达式在执行时是可以允许undifined和null的。 在Javascript中,计算a.b.c会抛出一个异常,如果这不是一个对象的话。但是如果大多数时候表达式是用来作数据绑定的,像下面这种形式:
那么表达式返回一个空值会比触发异常更有意义。因为通常我们是在等待服务器的响应,并且变量马上就会被定义和赋值。如果表达式不能容忍未定义的值,那么我们绑定的代码就不得不写成形如:
{{((a||{}).b||{}).c}}
angular在执行未定义的函数a.b.c()是,也会返回undefined,不会触发异常。
没有流程控制结构
你不能在表达式中使用控制结构。这样设计的原因在于AngularJS的设计理念之一就是逻辑代码都应该在控制器里。如果你需要使用条件、循环、或者处理异常,你就应该写在控制器的方法里。
当你将数据呈献给用户时,你很可能需要将数据转换为阅读友好的格式。比方说,你可能需要在显示之前将一个日期对象转换为用户本地的时间格式。你可以用链式的过滤器来传递表达式,像下面这样:
name | uppercase
这个表达式会将name的值传递给uppercase这个过滤器。
链式过滤器使用的是下面这样的语法:
value | filter1 | filter2
你也可以通过冒号来给过滤器传递参数,比如,将123显示成带有两位小数的形式:123 | number:2
你可能会好奇,这个$的前缀有什么用?其实这只是一个标记AngularJS专有属性的符号,用来表示区别于开发者自定义属性的符号。
AngularJS的设计是在已有的对象上添加行为。使用$做前缀的话,就能使得开发者的代码和AngularJS的代码和谐共处了。
Copyright &
All Rights Reserved &&&&&&

我要回帖

更多关于 angularjs 捕获异常 的文章

 

随机推荐