时间戳

首页 > 解决方案 > aureliajs 条件父布局

module - aureliajs 条件父布局

问题描述

我正在用 aureliajs 编写我的客户端应用程序。默认情况下，对于这样的路由：

/app/access/management

我的应用程序呈现如下：

渲染模式

例如，假设标题和侧边栏被渲染app，然后是一个公共容器access，最后是 .html 中的主 html management。

现在我有一个子组件，access例如 name list。在这个组件中，我希望在没有任何父容器（没有父 html 标记）的情况下呈现页面。

所以我想我有一些解决方案：

  1. list例如，在另一个模块中制作，/app1/access/list它不会在 app1 上呈现任何额外的 html 并访问。

  2. 在里面做一个条件app，access决定绘制页眉和页脚等。

  3. 调用一个函数list来隐藏父级中绘制的布局。

但我找不到最好的方法。例如，一种告诉父母不要渲染某些东西的方法。

最佳实践或模式是什么？

标签： modulerenderaurelia

解决方案

与 MVC 样式的主/布局页面类似，Aurelia 允许您将“布局”视图（如 MVC“主模板”）用于一组视图。

作为布局一部分的一组视图在 Aurelia 中定义为由路由器配置中的一个或多个路由引用的一组视图。有两种方法可以将布局与路线相关联。第一个是通过 HTML，第二个是通过视图模型代码。...

和

...要在 router-view 自定义元素上指定布局，我们使用以下属性：

  • layout-view - 指定要使用的布局视图的文件名（带路径）。
  • layout-view-model - 指定要与布局视图一起使用的视图模型的 moduleId。
  • layout-model - 指定模型参数传递给布局视图模型的激活函数。...

然后通过路由配置：

...我们还可以使用视图模型中的代码将布局与路线配置相关联。假设我们喜欢上面所做的，但我们有几个视图希望与不同的布局相关联，因此希望部分覆盖 HTML 中给出的配置。以下代码是我们如何做到这一点的示例：...

建议你仔细阅读这篇文章：aurelia router configuration --> Layouts

推荐阅读