aureliajs 条件 parent 布局

aureliajs conditional parent layout

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

/app/access/management

我的应用程序呈现如下:

例如,假设页眉和侧边栏在 app 上呈现,然后是 access 中的公共容器,最后是 management 中的主要 html。

现在我有一个 access 的 sub-component,例如名称为 list。在这个组件中,我希望页面在没有任何 parent 容器的情况下呈现(没有 parent html 标签)。

所以我想我有一些解决办法:

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

  2. appaccess中设置一个条件来决定绘制页眉和页脚等

  3. 调用 list 中的函数以在 parent 秒内隐藏绘制的布局。

但我找不到最好的方法。例如,一种告诉 parent 不渲染某些东西的方法。

最佳实践或模式是什么?

您可以使用条件 if access component ViewModel 检查路由是否为 /app/access/list,然后使用更少的容器加载组件 属性。

Similar to MVC-style master/layout pages, Aurelia allows you to use a "layout" view like an MVC "master template" for a set of views.

The set of views subject to being part of a layout is defined in Aurelia as a set of views referenced by one or more routes in a router configuration. There are two ways to associate a layout with routes. The first is via HTML, the second is via view model code. ...

... To specify a layout on the router-view custom element, we use the following attributes:

  • layout-view - specifies the file name (with path) of the layout view to use.
  • layout-view-model - specifies the moduleId of the view model to use with the layout view.
  • layout-model - specifies the model parameter to pass to the layout view model's activate function. ...

然后通过路由配置:

... We can also associate layouts with route configurations using code in our view model. Suppose we like what we've done above, but we have a couple views that we would like to associate with a different layout and would thus like to partially override the configuration given in the HTML. The following code is an example of how we can do that: ...

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