Angular.js-如何加载其他菜单

Question

I 'm starting jquery migrating an application to angular, but it has made me a bit complex. 我开始将应用程序迁移到angular的jQuery，但这使我有点复杂。 I need to know if someone could help me as routing and load controllers, when login any user. 登录任何用户时，我需要知道是否有人可以帮助我作为路由和负载控制器。 There are two types of users 有两种类型的用户

Students 学生们
Teachers 教师

Each has a different menu , which in turn has different html pages. 每个菜单都有一个不同的菜单，而菜单又具有不同的html页面。 Depending on the role the user to enter then load the specific menu. 根据用户输入的角色，然后加载特定菜单。

Using the jQuery load event , and changed the content which changes within a div . 使用jQuery load事件，并更改了在div内更改的内容。 I would like to know how to perform this process with angular . 我想知道如何使用angular来执行此过程。

index.html 的index.html

<html>
  <head> Files ... </head>
  <body>
    <div id="container"></div>
  </body>
</html>

student-menu.html 学生menu.html

<div>
  <div>option-1</div>
  <div>option-2</div>
  <div>option-3</div>
  <div>option-N</div>
 </div>

students-pages 学生的页面

option-1.html
option-2.html
option-3.html
option-N.html

teacher-menu.html 教师menu.html

<div>
  <div>option-1</div>
  <div>option-2</div>
  <div>option-3</div>
  <div>option-N</div>
 </div>

teachers-pages 教师的页面

option-1.html
option-2.html
option-3.html
option-N.html

Appreciate a clear explanation. 欣赏清楚的解释。

Answer 1

Please consider reading about including ui-router in your amazing application and learn about templateProvider usage. 请考虑阅读有关在惊人的应用程序中包括ui-router ，并了解templateProvider用法。

As soon as you done with above things all you need is: 完成以上所有操作后，您需要做的就是：

Create Service that will have getCurrentUserStatus() that should acquire from loaded data about user his status in your system 创建具有getCurrentUserStatus() Service ，该Service应从加载的用户数据中获取其在系统中的状态

Depending on status configure your child views: { 'menu': { ... } } with 根据状态配置您的子views: { 'menu': { ... } }

 //somewhere above const TEMP = { user: 'path/to/file.tpl.html', admin: 'path/to/admin.tpl.html' } //somewhere in view configuretion ..., templateProvider (AuthService) { return TEMP[AuthService.getCurrentUserStatus()]; }, ...

Create all another pages with totally same approach of choosing needed template. 以完全相同的方式选择所需模板来创建所有其他页面。

PS This allows you to expand list of variable templates unless your imagination will empty :D PS这可以让您扩展变量模板的列表，除非您的想象力为空：D

PPS Noobs way - lot of ng-include with ng-if on every view that will be changed depending on viewer. PPS Noobs方式-每个视图上的ng-if都会ng-include很多ng-include ，这将视查看器而定。

Angular.js-如何加载其他菜单

问题描述

1 个解决方案

解决方案1
2 已采纳 2015-11-03 20:53:21

Angular.js-如何加载其他菜单

问题描述

1 个解决方案

解决方案1 2 已采纳 2015-11-03 20:53:21

解决方案1
2 已采纳 2015-11-03 20:53:21