文章/答案/技术大牛

发布

社区首页 >问答首页 >AngularJS认证-指令之间的不兼容性？

问AngularJS认证-指令之间的不兼容性？
EN

Stack Overflow用户

提问于 2013-06-25 22:30:09

回答 1查看 873关注 0票数 1

我对角JS开发非常陌生，我正在尝试实现以下身份验证模块：https://github.com/witoldsz/angular-http-auth (http://www.espeo.pl/2012/02/26/authentication-in-angularjs-application上的更多信息)，用于我的项目。

模块

据认为，该模块允许出现以下情况：

用户要求:omething.com/secured/formXyz，
服务器发送登录表单，
用户登录，填写一个长而复杂的表单，但是他们做的时间太长以至于他们的会话到期，
用户提交表单，但由于会话不再有效，因此出现登录屏幕，
一旦用户登录，服务器可以处理提交的表单，**无需再次输入所有内容**。

这样做的解决办法是：

服务器端行为:

对于每个/资源/*调用，如果用户未被授权，则响应401状态。否则，当用户获得授权或没有/resources/*请求时，发送客户端请求的内容。

客户端行为:

捕捉401回应，
保存请求参数，这样以后我们可以重建原始请求，
创建并返回表示服务器未来答案的新对象(而不是返回原始失败的响应)，
广播，说明需要登录，因此应用程序可以作出反应，特别是可以出现登录表单，
侦听登录成功的事件，这样我们就可以收集所有保存的请求参数，重新发送它们并触发所有“未来”对象(以前返回)。

我的项目

我的项目是一个基本项目，它使用$route服务。当我试图添加捕获事件的指令时：

脚本/指令/登录-directive.js

angular.module('myApp', ['http-auth-interceptor','content-mocks'])
/**
* This directive will find itself inside HTML as a class,
* It is responsible for showing/hiding login form.
*/
.directive('authDirective', function() {
return {
  restrict: 'C',
  link: function(scope, elem, attrs) {  
    
    var login = elem.find('#login');
    var main = elem.find('#main');
    
    login.hide();
    main.show();
    
    scope.$on('event:auth-loginRequired', function() {
        login.show();
        main.hide();
    });
    scope.$on('event:auth-loginConfirmed', function() {
        main.show();
        login.hide();
    });
  }
}
});

给我的index.html：

<body ng-app='myApp' class='auth-directive'>
    
    <!--[if lt IE 7]>
    <p class="chromeframe">You are using an outdated browser. <a href="http://browsehappy.com/">Upgrade your browser today</a> or <a href="http://www.google.com/chromeframe/?redirect=true">install Google Chrome Frame</a> to better experience this site.</p>
    <![endif]-->
    <!--[if lt IE 9]>
    <script src="components/es5-shim/es5-shim.js"></script>
    <script src="components/json3/lib/json3.min.js"></script>
    <![endif]-->
    
    <div id="login" name="login">
        <p>login</p>
    </div>

    <div id="main" name="main">
        <p>main</p>
        <div class="container" ng-view></div>
    </div>
    
    <script src="components/angular/angular.js"></script>
    <script src="components/angular-resource/angular-resource.js"></script>
    <script src="components/angular-cookies/angular-cookies.js"></script>
    <script src="components/angular-sanitize/angular-sanitize.js"></script>
    <script src="components/angular-http-auth/angular-mocks-1.0.1.js" type="text/javascript"></script>
    <script src="components/angular-http-auth/http-auth-interceptor.js" type="text/javascript"></script>
    <script src="scripts/app.js"></script>
    <script src="scripts/controllers/main.js"></script>
    <script src="scripts/directives/login-directive.js"></script>
    <script src="scripts/mocks/content-mocks.js" type="text/javascript"></script>

</body>

指令ngView不再工作了。控制台日志中没有显示任何内容。这两个指令之间是否有不兼容之处？

authentication

angularjs

angularjs-directive

回答 1

Stack Overflow用户

回答已采纳

发布于 2013-06-26 11:16:43

从登录指令文件的外观来看，您似乎(不恰当地)通过将依赖项数组作为第二个参数传递给angular.module调用来重新初始化角度应用程序：

angular.module('myApp', ['http-auth-interceptor','content-mocks'])

当应用程序初始化时(可能是在app.js中)，以及当您想在另一个文件中引用应用程序时，您应该在没有第二个参数的情况下调用angular.module：

angular.module('myApp')
   .directive('authDirective', function() { ...

票数 2

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/17308662

复制

相似问题

问AngularJS认证-指令之间的不兼容性？
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问AngularJS认证-指令之间的不兼容性？EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问AngularJS认证-指令之间的不兼容性？
EN