2016-01-10 153 views
1

當涉及到只有被記錄的用戶應該能夠查看的頁面時,我在該頁面的控制器中具有這樣的功能;Angular - 受保護頁面

if (user is not logged in) { 

    $state.go('someState') 

} else { 

    // prepare the page as normal 

} 

考慮到我需要在每一頁上寫這樣的內容,我想認證,我覺得也許有更優雅的解決方案。

我應該在app.run中執行此操作嗎?像是

var protectedPages = a list of protected pages 

    if (protectedPages && user is not logged in) { 

     $state.go('someState') 

    } else { 

     // prepare the page as normal 

    } 

還是有更加標準的方法,是完全不同的?

+0

而不是白名單,這將是很好,如果每個頁面可以報告需要登錄檢查。 – dandavis

回答

2

一般,我相信這些一種情況最好的辦法是設置一個頁面更改事件並定義邏輯有...

但定義邏輯,你需要知道的一些屬性,下一個狀態,所以你可以爲每個狀態添加一些數據,如要求登錄。這些屬性是完全自定義的,所以你可以定義任何你想要的。

讓我們定義了一些狀態,這是requiresLogin

$stateProvider 
     .state('exampleState', { 
      url: '/example', 
      controller: 'ExampleController as vm', 
      templateUrl: 'example.html', 
      data: { 
       requiresLogin: true, 
       someOtherCustomProperty: 'It can be anything' 
      } 
     }) 

當你看到exampleState已配置塊現在requiresLogin屬性,我們可以得到這樣的數據,並允許用戶去exampleState或重定向他一些其他的州。

$rootScope.$on('$stateChangeStart', function (event, toState) { 
     // if next state requires login and user is not loged in 
     if (toState.data.requiresLogin && userNotLogedIn) { 
      // prevent default behaviour and implement your logic here 
      event.preventDefault(); 

      // TODO 

      // as an example you can redirect user to login state 
      $state.go('login'); 
     } 
    }); 

就是這樣。所有你需要做的就是把這個邏輯配置塊,因爲它應該檢查每個狀態的變化...

+0

這看起來不錯,明天就會亮相,讓你知道它是怎麼回事! – user2085143

+0

一個簡單的方法是將所有受保護的頁面保存在相同的父狀態中......然後使用該父項上的解析 – charlietfl