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动态菜单加载和路由

回答

相关问题