用加载的内容替换 ui-view答案

【问题标题】：Replace ui-view with the loaded content用加载的内容替换 ui-view
【发布时间】：2015-01-26 11:10:08
【问题描述】：

然后我像这样将它们加载到我的页面中

<div data-ui-view="content"></div>   --- 75% width
<div data-ui-view="sidebar"></div>   --- 25% width

现在，当加载内容时，我希望加载的内容不加载到这些 ui-view div 中，而是替换它们。是否可以？因为如果它们不替换，那么在我的情况下，浮动将不起作用，并且侧边栏会显示在内容下方。

请帮忙

谢谢

【问题讨论】：

【解决方案1】：

使用 Bootstrap rows 会实现您的目标吗？

<div class="row">
    <div class="col-md-9" ui-view="content"></div>
    <div class="col-md-3" ui-view="sidebar"></div>
</div>

【讨论】：

【解决方案2】：

这是不可能的，也是不可取的，因为它会使您无法更改状态。一个简单的解决方法是将宽度/浮动样式直接添加到 ui-view div。

如果你决定让它工作，你可以创建一个自定义指令包装器，就像here提供的解决方案一样。

【讨论】：

确实，您可以将您的 id、类等直接添加到包含 ui-view 属性的标签中以进行样式设置。但是，由于视图的主体在另一个部分中，这会导致组件的标识（在 CSS 中定义其命名空间的类或 id）与其内容或子项之间存在分裂。我个人觉得这很烦人。自定义指令的想法似乎很老套。我们即将升级到 1.6，所以也许“真正的组件”可以解决这个问题？

【解决方案3】：

尝试将您想要的尺寸添加到容器的样式中。

<div data-ui-view="content" style="width: 75%;"></div>
<div data-ui-view="sidebar" style="width: 25%;"></div>

【讨论】：