如何在Angularjs

时间:2018-03-08 13:36:29

标签: angularjs session scope coldfusion

我有一个Angularjs应用程序。在主页面中,我使用 ng-view 指令调用视图。我想根据JS变量的值隐藏视图。

实际上,我检索了Coldfusion SESSION变量的值(我使用此指令在JS变量中进行转换:

<script type="text/javascript" language="JavaScript">
    <cfoutput>
        var #toScript(SESSION.viewerRole, "viewerRole")#;
    </cfoutput>
</script>

我在每个控制器中传递此变量。

如果 viewRole 的值等于1,我会尝试显示视图,如果不是这样的话,我会尝试显示错误消息:

在我的index.html中:

<!DOCTYPE html>
<html xmlns:ng="http://angularjs.org">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <meta http-equiv="X-UA-Compatible" content="IE=edge">

        <meta http-equiv="Pragma" content="no-cache">
        <meta http-equiv="Cache-Control" content="no-cache">
        <meta http-equiv="Expires" content="-1">


        <script type="text/javascript" language="JavaScript">
            <cfoutput>
                var #toScript(SESSION.viewerRole, "viewerRole")#;
            </cfoutput>
            console.log("viewerRole: " + viewerRole); //OK it's working
        </script>           

        <title>My App/title>    
    </head>

    <body ng-app="ContactsApp" class="ng-app:ContactsApp" id="ng-app">

        ....................................................

        <cfif #SESSION.viewerRole# eq 1>            
            <ng-view></ng-view>
        <cfelse>
            <div class="alert alert-danger">
                <div>
                  you do not have sufficient access rights to access to this section
                </div>              
            </div>      
        </cfif>

        <script src="lib/js/angular.min.js"></script>
        <script src="lib/js/angular-route.min.js"></script>
        <script src="lib/js/angular-sanitize.min.js"></script>

        <script src="app/app.js"></script>
        <script src="app/appService.js"></script>

        <script src="lib/js/ngDialog.js"></script>

    </body>
</html>

这是我的app.js:

var app=angular.module('ContactsApp', ['ngRoute', 'ui.bootstrap', 'ngDialog', 'angular-popover']);

// register the interceptor as a service
app.factory('HttpInterceptor', ['$q', '$rootScope', function($q, $rootScope) {
       return {
            // On request success
            request : function(config) {
                // Return the config or wrap it in a promise if blank.
                return config || $q.when(config);
            },

            // On request failure
            requestError : function(rejection) {
                //console.log(rejection); // Contains the data about the error on the request.  
                // Return the promise rejection.
                return $q.reject(rejection);
            },

            // On response success
            response : function(response) {
                //console.log(response); // Contains the data from the response.
                // Return the response or promise.
                return response || $q.when(response);
            },

            // On response failure
            responseError : function(rejection) {
                //console.log(rejection); // Contains the data about the error.
                //Check whether the intercept param is set in the config array. 
                //If the intercept param is missing or set to true, we display a modal containing the error
                if (typeof rejection.config.intercept === 'undefined' || rejection.config.intercept)
                {
                    //emitting an event to draw a modal using angular bootstrap
                    $rootScope.$emit('errorModal', rejection.data);
                }

                // Return the promise rejection.
                return $q.reject(rejection);
            }
        };
 }]);

app.config(function($routeProvider, $httpProvider, ngDialogProvider){

    console.log("CONFIG - adminRole: " + adminRole + " -- authorRole: " + authorRole + " -- viewerRole: " + viewerRole ); // It's correctly retrieved

    $httpProvider.defaults.cache = false;
    if (!$httpProvider.defaults.headers.get) {
        $httpProvider.defaults.headers.get = {};
    }

    // disable IE ajax request caching
    $httpProvider.defaults.headers.get['If-Modified-Since'] = '0';

    // Add the interceptor to the $httpProvider to intercept http calls
    $httpProvider.interceptors.push('HttpInterceptor');

    $routeProvider.when('/all-contacts',
    {
      templateUrl: 'template/allContacts.html',
      controller: 'ctrlContacts',       
    })
    .when('/view-contacts/:contactId',
    {
      templateUrl: 'template/viewContact.html',
      controller: 'ctrlViewContacts'
    })  
    .otherwise({redirectTo:'/all-contacts'});  
});    

app.config(function ($httpProvider) {
    $httpProvider.interceptors.push('httpInterceptor');
});

app.controller('ctrlContacts', function ($scope, $timeout, MyTextSearch, ContactService, RequestService, ngDialog){
    $scope.adminRole =  adminRole;
    $scope.authorRole = authorRole;
    $scope.viewerRole = viewerRole;

    console.log("ctrlContacts: " + adminRole + " -- authorRole: " + authorRole + " -- viewerRole: " + viewerRole ); // It's correctly retrieved

    // LOAD THE LAST REQUESTS
    RequestService.loadLastRequests().success(function(lastRequests, status, header, config){
        .................................
    }   
});

一切正常,但是如果我用F5刷新页面我遇到了问题:视图没有显示,并且显示错误消息(您没有足够的访问权限来访问此部分)。

你能帮帮我吗?

提前感谢您的帮助

1 个答案:

答案 0 :(得分:0)

我找到了问题的根源。我在功能 onrequeststart 中的 application.cfc 中添加了会话数据。但如果它们存在,我没有考虑会话中的当前值。

现在它已经解决了