验证后面的Angular单页面应用程序

时间:2014-11-24 06:26:01

标签: angularjs

嗨,我是Angular的新手,我需要帮助。

我想创建单页面应用。

基本信息:

  • 通过网址导航
  • 整个应用程序落后于身份验证(如果未授权只有登录页面显示,可能,重置密码,联系页面等... - >我将选择未经授权的网址)
  • 验证后面的
  • 是静态布局,如标题,菜单,侧栏,页脚和内容容器(ng-view)

请帮我(html结构,模板,控制器,指令等......)

我对结构的看法 网页:

  • 的index.html
  • 登录-template.html
  • 布局template.html
  • 菜单template.html
  • content1.html
  • content2.html
  • content3.html
  • content4.html
  • 列表的项-template.html

我不知道索引页面必须包含什么,但在layout-template.html中会有一些静态html,一些模板如menu-template.html和ng-view,其中的内容将通过URL显示。

在某个模板中,将是另一个模板,例如带有此列表模板控制器的项目列表的模板

我想要每个模板的控制器,例如:(loginCtrl,layoutCtrl,menuCtrl,content1Ctrl)

我希望这是有道理的

谢谢

1 个答案:

答案 0 :(得分:0)

我是一个像你一样的Angular新手,并选择去Yeoman Angular生成器,因为它非常方便处理文件结构并制作所有需要的样板,单元测试环境等等。所以,基本上检查{ {3}}并从那里做教程。然后启动您自己的项目,并使用角度子生成器创建视图,如下所示:

拳头使你的应用程序基本结构:

yo angular

然后使用子生成器添加路径视图(角度生成器的详细信息可以从http://yeoman.io找到)

yo angular:route your_view
...

至少我使用index.html来定义整个应用程序的静态布局,然后我在中间部分有#34;"像角度生成器这样的页面默认示例使用由" yo"生成的单独HTML文件中的视图。 -命令。我不需要(还)SASS,但我对bootstrap css很好。最后,为了保持HTML文件的美观和干净,我发现ng-include指令非常方便,例如如果使用HTML标签并将每个标签内容放在各自的HTML文件中。

身份验证在后端完成,其中Web服务器在用户未经过身份验证时静态重定向到登录页面,并在有适当授权时到我的索引页面。

我确信还有很多其他方法可以做到这一点,但这就是我做到的。它工作得很好,在维护方面似乎也很方便......