基於用戶安全權限顯示按鈕的Angular2最佳實踐

我目前正在開發我的第一個Angular 2站點。該網站在左側包含Bootstrap導航欄，以便用戶可以導航到網站上的不同頁面。每個用戶都可以在NavBar中看到不同的導航按鈕，具體取決於他們的安全權限。基於用戶安全權限顯示按鈕的Angular2最佳實踐

目前我剛剛嘲笑它的行爲就好像按鈕已從數據庫檢索到數組中。然後每個按鈕通過在數組中循環顯示在NavBar中。請參閱下面的代碼。

問題

它的工作原理，但是這是做的最好的方法是什麼？
有沒有更好的最佳實踐方式來根據用戶安全權限從數據庫檢索設置並顯示這些設置？
還有什麼我需要考慮使它更安全嗎？

navbar.component.heml

<div class="nav-side-menu"> 
    <div class="brand">NavBar</div> 

    <div class="menu-list"> 
     <ul id="menu-content" class="menu-content collapse out"> 
      <li *ngFor="let appButton of appButtons"> 
       <a href="#"> 
       <i class="{{appButton.buttonClass}}"></i> {{appButton.displayName}} 
       </a> 
      </li> 
     </ul> 
    </div> 
</div>

navbar.component.ts

import { Component, OnInit } from '@angular/core'; 

@Component({ 
    selector: 'app-navbar', 
    templateUrl: './navbar.component.html', 
    styleUrls: ['./navbar.component.css'] 
}) 
export class NavbarComponent implements OnInit { 

    constructor() { } 

    ngOnInit() { 
    } 

    // Hard coded in at the moment, but these settings 
    // will be retrieved from the DB 
    appButtons = [ 
    { displayName: "Dashboard", buttonClass: "fa fa-dashboard fa-lg" }, 
    { displayName: "Gift", buttonClass: "fa fa-gift fa-lg" }, 
    { displayName: "Globe", buttonClass: "fa fa-globe fa-lg" }, 
    { displayName: "Search", buttonClass: "fa fa-search fa-lg" } 
    ]; 
}

來源

2017-02-20 m_collard

不像從數據庫帶來的按鈕。根據角色對用戶進行分類。將這些角色添加到數據庫中，並根據角色顯示按鈕。

您可以藉助角色添加其他類型的安全性/訪問級別。

這比從數據庫中獲取按鈕要好得多。

來源

2017-02-20 09:39:21 Gourav

基於用戶安全權限顯示按鈕的Angular2最佳實踐

回答

相關問題