在angularjs中动态更改div位置

Question

我有一个（复杂的）工具栏面板，可以位于页面的顶部或底部（可配置）。有没有办法避免将工具栏复制/粘贴到页面底部？

以下是复制/粘贴方式的代码：

<div id="topToolbar" data-ng-show="configs.toolbarPosition=='TOP'">
    <!-- toolbar -->
</div>

<div>
    <!-- inner page contents -->
</div>

<div id="bottomToolbar" data-ng-show="configs.toolbarPosition=='BOTTOM'">
    <!-- exactly copy/pasted toolbar -->
</div>

Answer 1

将工具栏html保存在单独的文件中，并include保存在您需要的位置。

<ng-include src="'views/toolbar.html'"></ng-include>

此外，如果您需要为所有功能添加控制器。这将有助于您重用代码。

Answer 2

您可以查看组件的制作方式 并制作组件＆lt; toolbar＆gt;＆lt; / toolbar＆gt;