Angular 2動態菜單加載和路由

我正在嘗試設計一個網站。用戶可以有不同的角色，例如管理員，經理或員工，這些角色將在登錄時決定。其餘url返回登錄用戶的類型。我想根據用戶類型動態加載視圖。動態地，我的意思是側邊欄必須加載特定於該用戶的菜單，並且着陸頁必須是動態的，具體取決於用戶。請告訴我如何做或請將我重定向到適當的資源。因爲這是我沒有的起點任何代碼示例附加。請幫助。提前感謝。Angular 2動態菜單加載和路由

更新

截至目前在有一個登錄coponent將重定向到我的主頁上這樣

this.router.navigate(['/home']);

，並在主頁菜單從裝載數據庫如

this.menuLoader.getFunctionalities(this.empId).subscribe(response => { 
 
     this.roleArray=response; 
 
     this.roleArray.forEach((element) => { 
 
     this.funtionalities = element.functionList; 
 
     console.log(element.functionList); 
 
     }); 
 
    });//subscribe ends here 
 
    }

和在HTML我有

<li *ngFor = "let x of funtionalities" (click)="closeSidenav()"> <a class="item white" [routerLink] = "'/home'+x.FunctionValue">{{ x.FunctionName.toUpperCase() }}</a></li>

和我有數據庫結構等

{ 
 
    "_id" : ObjectId("59676398506d3c2e58feb5d2"), 
 
    "role" : "admin", 
 
    "functionList" : [ 
 
     { 
 
      "FunctionName" : "Create CFT", 
 
      "FunctionValue" : "/createCFT" 
 
     }, 
 
     { 
 
      "FunctionName" : "Update CFT", 
 
      "FunctionValue" : "/updateCFT" 
 
     }, 
 
     { 
 
      "FunctionName" : "Add Employee", 
 
      "FunctionValue" : "/addEmployee" 
 
     }, 
 
     { 
 
      "FunctionName" : "Add Resource", 
 
      "FunctionValue" : "/addResource" 
 
     }, 
 
     { 
 
      "FunctionName" : "Add Employees-Excel", 
 
      "FunctionValue" : "/addEmployeesExcel" 
 
     }, 
 
     { 
 
      "FunctionName" : "Add Holiday List", 
 
      "FunctionValue" : "/holidayList" 
 
     }, 
 
     { 
 
      "FunctionName" : "Add Employees to CFT", 
 
      "FunctionValue" : "/addEmployeeToCft" 
 
     } 
 
    ] 
 
}

來源

2017-07-15 Vikhyath Maiya

什麼是你的代碼一樣。請更新它發佈。問題太寬了 – Aravind

更新了aravind的問題。 –

你的財產functionList包含未在*ngFor使用如下修改路由的內容，

<li *ngFor = "let x of funtionalities.functionList" (click)="closeSidenav()"> 
    <a class="item white" [routerLink] = "'/home'+x.FunctionValue"> 
      {{ x.FunctionName.toUpperCase() }} 
    </a> 
</li>

來源

2017-07-15 15:10:50 Aravind

被分配到組件代碼中的功能，而問題是關於如何做動態加載。我認爲我所遵循的方法不是正確的方式去實現它。 –

嘗試此操作時是否出現錯誤。所有的路由定義都必須在'RouterModule'中有沒有這些定義？ – Aravind

我沒有得到任何錯誤，我有一個路由模塊定義爲wel.That不是問題。問題是'什麼是用於做上述解釋的問題的方法'。因爲我使用的方法，我真的不dont認爲這是使用的優先方法 –

Angular 2動態菜單加載和路由

回答

相關問題