使用AngularJS的具有“门户”或MDI功能的大型单页面应用程序

时间:2013-05-06 14:12:10

标签: angularjs angular-ui angularjs-routing

我有一个问题涉及如何使用angularjs以及必要的ui-router最佳组合一个非常大的单页面应用程序。

我的情况就是这样。

  • 我有多个组件,可以说是趋势模块,“业务”分析器,仪表板/工作区以及许多其他组件。
  • 从启动器边栏开始,模块可以在单独的选项卡中打开一次或多次,就像在旧式MDI窗口应用程序中一样。
  • 有些模块是完全独立的,有些可能会使用/共享一个可能位于页面某处的公共过滤小部件。

一般的想法是,每个组件都可以在不同的选项卡中多次打开,这样用户就可以在工作流程中轻松切换它们。另一件事是所有人都应该支持url链接。打开网址不会涉及重新打开所有“标签”,只是网址链接到的标签。

使用angularjs时,到目前为止我的有限理解表明,实现这一目标的最佳方法是将我的项目拆分为大型应用程序推荐的单独业务模块。每个业务模块包含相关的模板,服务,指令等。

然后我可以使用ng-include包含模板,然后为每个业务模块实例化控制器。我已经测试过,可以多次实例化同一个控制器,并将自己的数据分开保存。每次创建特定控制器时都需要包含所需的模板。这将涵盖我们想要在单独的选项卡中多次实例化同一模块的情况。

这并没有解决url链接的问题,虽然它带我到支持多个ui-views的ui-router替代方案,这可能也可能解决这个问题,但我还不太清楚。我想使用ui-router可以包含一个url语法,其中包含每个视图的“实例”,但我不确定如何做到这一点。使用手动引导的多个应用程序的想法似乎是不可能的,因为这减少了不同模块之间通信的可能性,并且一般意见似乎表明这是一个坏主意。

对于在这种情况下什么是好方法,我将不胜感激。

1 个答案:

答案 0 :(得分:0)

你只能在一个html中使用一个ngApp

参考此链接

http://docs.angularjs.org/api/ng.directive:ngApp