如何使用<div ng-view =“”>多次

时间:2015-07-08 06:18:39

标签: javascript angularjs ngroute

在我的应用程序中,我有一个index.html文件,其中我已经加载了所有必需的脚本,并且正文包含空的ng-view,其内容将根据路由URL进行更新。 第一页是登录页面,我正在向用户显示一个按钮,点击显示登录页面的按钮,方法是更改​​$ location的路径值。

在成功登录后,仪表板页面应该位于标题,侧边栏页脚区域将被修复的位置,并且只有中心区域将根据标题部分中的菜单点击进行更改,方法是更改​​路径值 所以中心区域我声明为

当我尝试加载dashboard.html页面时,它将进入无限循环,当我删除中心div时,它只是一个空视图,我的视图渲染正常。所以问题在于使用

任何人都可以建议我,我的理解是否是核心?

如果是,请建议我如何达到我的要求......

的index.html

@Provider
public class ThrowableExceptionMapper implements ExceptionMapper<Throwable> {

    public ThrowableExceptionMapper() {
        // TODO Auto-generated constructor stub
    }

    @Override
    public Response toResponse(Throwable throwable) {
        if (throwable instanceof WebApplicationException) {
            return ((WebApplicationException) throwable).getResponse();
        } else {
            return Response.serverError().entity("").build();
        }
    }
}

dashBoard.html

    <div class="row">
         <div data-ng-view=""></div>

    </div>

我提供了html代码

由于

2 个答案:

答案 0 :(得分:2)

默认路由器不支持您尝试执行的操作。您可以尝试ui-router,它支持多个嵌套视图。您可以在此处查看示例http://plnkr.co/edit/7FD5Wf?p=preview。 index.html包含主视图。

<body ng-controller="MainCtrl" class="container">
  <div ui-view></div>
</body>

contacts.html内,还有另一个视图

<h1>My Contacts</h1>
<div ui-view></div>

答案 1 :(得分:1)

尝试检查路由提供程序状态提供程序之间的区别。 这是一个link,可以帮助您轻松搜索。