4

短縮版：

この plunkr ページはロールが未定義として取得されるため、表示されるはずのコンテンツが表示されませんが、クリックによってトリガーされると、ロールは正しいように見えます。

問題を強調するサンプル plunkr:

http://plnkr.co/edit/QHUpCv?p=preview

全体のバージョン:

アプリケーションのすべてのビューに対して永続的な静的メニューがあります。明らかな理由から、XHR リクエストを表示する前に解決したいと考えています。

an-init を使用してみましたが、関数呼び出しを非同期的に行うだけで、$q オブジェクトからの約束を使用しようとしましたが、どちらも役に立ちませんでした。

html:

<div ng-app="myApp" ng-controller="homeCtrl">
<div ng-init="loadCurrentUser()" ng-include src="'partials/menu.html'"></div>
  <ng-view></ng-view>
</div>

コントローラ：

controller('homeCtrl', function($scope, $route, $location, authService){
    $scope.loadCurrentUser = authService.loadCurrentUser;
    $scope.model = {message : 'Hello Oleg'};
    $scope.logCurrentUser = function(){
        var user = authService.getUser();
        console.log(user);
    }

});

サービス：

 authServ.loadCurrentUser = function () {
        alert('here');
        // var defer = $q.defer();
        return $http.get('/users/me', {
            withCredentials: true
        }).
        success(function (data, status, headers, config) {
            console.log(data);
            that.currentUser.company = {};
            that.currentUser.company.id = that.currentUser.company.id ? that.currentUser.company.id : data.main_company;            
            that.currentUser.companies = [];
            for (var i in data.roles) {
                that.currentUser.companies[data.roles[i]['company']] = data.roles[i]['company_name'];
                if (data.roles[i]['company'] == that.currentUser.company.id){
                    that.currentUser.role = data.roles[i]['role_type']; 
                    that.currentUser.company.name = data.roles[i]['company_name'];
                    // console.log(that.currentUser.role);
                } 
            }
            // defer.resolve(data);
            // defer.resolve();
        }).
        error(function (data, status, headers, config) {
            that.currentUser.role = 'guest';
            that.currentUser.company = 1;
            defer.reject("reject");
        });  
    // return defer.promise;
    }

ロール アクセス レベル ディレクティブを制限します。

angular.module('myApp.directives', []).
directive('restrict', function(authService){
    return{
        restrict: 'A',
        prioriry: 100000,
        scope: {
            // : '@'
        },
        link: function(){
            // alert('ergo sum!');
        },
        compile:  function(element, attr, linker){
            var user = authService.getUser();
                if(user.role != attr.access){
                console.log(attr.access);
                console.log(user.role);//Always returns undefined!
                    element.children().remove();
                    element.remove();           
                }

        }
    }
});
4

2 に答える 2

1

私はあなたが何をしているのか分かりませんauthService.getUser()

success呼び出しので設定できるテンプレート内の変数を監視できますXHR。

<div ng-app="myApp" ng-controller="homeCtrl">
<div ng-show="userLoaded" ng-include src="'partials/menu.html'"></div>
  <ng-view></ng-view>
</div>

コントローラーでは、成功のコールバックで次のことができます。

this.userLoaded = true;

(as / context)へbindの成功コールバック関数が必要になることに注意してください。以下を使用できます。$scopethis

.success(angular.bind(this, function (data, status, headers, config) {...},
    data, status, headers, config));

また、「それ」の意味がわかりません。$scopeコールバック内にアクセスしたい場合はangular.bind、上記のように使用します。

EDITng-if angular 1.1.xを使用している場合に使用 できます。また、要素を非表示にするだけでまったく作成しないようにする場合は、 を使用しますng-switch。ng-switch新しい を作成することに注意してください$scope。参照してください: https://groups.google.com/forum/#!topic/angular/lJSp-hkileY

ディレクティブ関数では、user.role実際にユーザーを認証しようとする前に評価されるコンパイル関数をチェックインしています。

于 2013-08-15T08:49:10.467 に答える