在Angular中延遲模板呈現以進行身份​​驗證檢查

Question

如果您的靜態URL導致內容與身份驗證方案結合使用，則角度會導致嚴重的安全問題。如果未註冊的用戶訪問該頁面，則在重定向到安全位置之前，內容會在屏幕上閃爍片刻。我發現這個問題，廣泛搜索，並解決了$ routeConfig中的解析屬性。不幸的是，無論我做什麼，它都不起作用。下面的代碼：

$routeProvider.when('/dashboard/:id', { 
    templateUrl: 'js/partials/dashboard.html', 
    controller:'DashCtrl', 
    access: access.user, 
    resolve: { 
     login: function(authService) { 
     var promise = authService.isLoggedIn(); 
     promise.then(function(data){ 
     // We're in successfully 
     }).catch(function(err){ 
      // ew, go away, redirect to login page 
      window.location = "login"; 
     }); 
     } 
    } 
}); 

AuthService.isLoggedIn（）看起來像：

isLoggedin : function() { 
     return $http.get("users/session_check").then(function(result) { 
      if (result.data) { 
       if (user == undefined) 
       { 
       placeholderService.populatePlaceholders(); 
       user = result.data; 
       } 
       return result.data; 
      } else { 
       return $q.reject("Please log in."); 
      } 
      }); 
    } 

不管是什麼，視圖閃爍。我的頁面上沒有ng-cloaks。我不知道還有什麼可以做的，但這已經變得徹頭徹尾的憤怒。

Answer 1

您傳遞給$ routeProvider的函數應爲返回一個承諾。例如：

$routeProvider.when('/dashboard/:id', { 
    templateUrl: 'js/partials/dashboard.html', 
    controller:'DashCtrl', 
    access: access.user, 
    resolve: { 
     login: function(authService) { 
     var promise = authService.isLoggedIn(); 
     return promise.then(function(data){ 
      // We're in successfully 
      return data; // This gets injected as "login" 
     }).catch(function(err){ 
      // ew, go away, redirect to login page 
      window.location = "login"; 
     }); 
     } 
    } 
}); 

而且，如果我沒有記錯，值這個承諾是fulfolled與最終被注入，能夠到控制器作爲一種服務（在這種情況下，login服務是不管你的承諾得到兌現用）。