Css 奥雷利亚的{wrap}引导导航栏不是'；不正常工作

我已经发现了我的问题，但似乎无法找到解决办法。我从{wrap}bootstrap中得到了一个主题，因为我不是nobody的平面设计师，我开始在Aurelia根据导航框架将其拼接在一起

我的问题是导航栏。使用骨架，路由在app.js中配置-很好，没问题-然后使用

<require from="nav-bar.html"></require>

将导航栏拉入页面。这会使CSS变形，因为正如F12告诉我的那样，在发出的HTML中添加了一个新元素作为导航栏组件的容器。在这种情况下，它是

<nav-bar class="au-target" router.bind="router" au-target-id="1">
<!-- usual bootstrap navbar stuff -->
</nav-bar>

---

如何解决这个问题？

使用Aurelia的

@containerless

装饰器：

import {containerless} from 'aurelia-framework';

@containerless
export class NavBar {
}

要实现这一点，您需要使用Aurelia的

@containerless

装饰器。据我所知，您需要一个完整的组件，而不仅仅是一个HTML视图。如果您还没有

nav bar.js

，那么创建一个也没什么大不了的

示例导航栏.js:

import {containerless} from 'aurelia-framework';

@containerless
export class NavBar {
}

用法：

import {containerless} from 'aurelia-framework';

@containerless
export class NavBar {
}

首先，需要在父视图中查看

nav bar

，如下所示。请确保不要指定

.html

，因为您希望它同时查找viewmodel：

<require from="nav-bar"></require>

---

您的解决方案是无容器视图。在Aurelia文档中搜索单词

无容器

。你完全正确，@LStarky。请将此作为答案发布，以便我可以为您提供解决方案积分。此解决方案已发布。如果你有任何进一步的困难，不要犹豫问。问题是这不应该引起问题。我们在骨骼中使用它，效果很好。