AngularJS - 在应用程序

时间:2015-07-09 11:22:43

标签: javascript angularjs node.js ng-view

目前我正在处理我的应用程序,我决定使用AngularJS作为构建我的前端代码的框架。但是,我对AngularJS没有任何经验,因此,我目前正在努力解决它的概念和逻辑。

下面你可以看到我的应用程序脚手架的草稿: application scaffold

所以我要做的是为我的整个应用程序创建一个单页面应用程序

<menu bar>内可以选择要在工作区内显示的不同页面。我了解到我可以通过使用<ng-view>指令来实现这种行为。

但是,我想要做的是,根据点击 <workspace>( - &gt;当前加载的视图)中的按钮,我想显示不同的{{1 }}。

例如:如果单击工作区内的<sidebars>按钮,则编辑对象的表单将加载到侧边栏中。

起初我虽然可以通过在应用程序中使用多个edit object指令来解决这个问题,但我了解到这是不可能的。

那么,您对如何实现上述行为有什么想法吗? 我想在应用程序中需要时异步加载ng-view。这些侧边栏模板应该包含一些逻辑,例如按钮提交数据等。

我真的不知道如何实现这种行为,因为我在这种情况下如何使用范围和控制器也很困难。

强烈建议任何想法,文章和示例!感谢。

编辑:我创建了一个小而且最小化的草稿,我想象AngularJS将如何处理这个过程: enter image description here

1 个答案:

答案 0 :(得分:1)

您可以使用Angular-UI。

UI-Router具有比默认AngularJS路由器更强大的路由功能。

对于视图,使用Angular-UI,您可以在同一文档(ui-view)中拥有多个视图,并且每个视图可以根据当前应用程序状态(URL)加载不同的模板。

以下是这些组件的文档:

你绝对应该看看它!

请注意,一旦您获得了两个模板,它们将处于不同的范围内,因此您需要某种通信服务来处理将数据从一个范围传递到另一个范围而无需进入$ watch或$ rootscope地狱。