AngularJS - 多种布局

Question

我刚开始使用AngularJS，我知道这是一个SPA。对于我们正在构建的应用程序，除索引页面之外的所有页面都将具有两列布局。但是，我们希望索引页面是一个单列的全宽页面。 AngularJS可以实现这一功能吗？

Answer 1

我建议张贴一名傻瓜或者jsfiddle，因为我不确定我是否真的回答了你的问题，或者如果你的问题还有其他问题我就错过了。

如果您通过路由（ng-view）执行所有页面，则只需应用类来区分该单列版本的样式。类似的东西：

.column_1, .column_2 { margin: 0; width: 50%; float: left; }
#firstpage .column_1, #firstpage .column_2 { margin: 0; width: 100%; float: none; }

然后在html中（仅在第一页上），将所有内容包装在div id =＆＃34; firstpage＆＃34;中。不要在路由页面中包含该div，并且该样式仅适用于第一页。或者，如果您有其他设置，您也可以始终使用ng-view周围的样式：

<div class="classname">
    <div ng-view></div>
</div>

如果你有一个侧栏位于你的观点之外并且那是你要关闭/打开的，那么我建议包括这个课程在第一页（使其全宽），同时在第一列使用ng-hide / ng-show的某种逻辑。