我正在使用 phonegap 和 twitter bootstrap（使用 angularui-bootstrap）构建一个应用程序。在使用 CSS 完成固定页眉和页脚上花费了很多时间我决定使用“iscroll”解决方案。
问题是我的页脚是动态的并且从控制器获取范围变量。“iscroll”功能通过 angularjs 指令绑定到 id="wrapper" 的 div。
目前，我在每个模板的末尾使用 ng-include，但使用此解决方案我将拥有多个 id="wrapper" 的 div。
示例可能如下所示：
<html>
<body>
<div id="footer"></div>
<div ng-view>
<!-- below goes data from template via controller -->
<div id="wrapper" ng-iscroll>
<!-- here goes scrollable content -->
Offer 1
Offer 2
...
</div><!-- end of scrollable div>
<div id="footer">Some footer data.. if wrapper displays offer list, show "refresh button, and next/previous offers page buttons, and "add new offer button".
If it displays "new offer" phase.. show "offer list" button....etc</div>
</div><!-- end of ng-view div -->
</body>
</html>
以上只会使所需的内容可滚动。但我不能在同一个html文件中使用多个div。
我尝试的第二个解决方案类似，但我将所有控制器内容移动到包装器本身，这使我的页脚也可滚动。
<html>
<body>
<div id="footer"></div>
<div id="wrapper" ng-iscroll>
<div ng-view>
<!-- below goes data from template via controller -->
<!-- here goes scrollable content -->
Offer 1
Offer 2
...
<div id="footer">Some footer data.. if wrapper displays offer list, show "refresh button, and next/previous offers page buttons, and "add new offer button".
If it displays "new offer" phase.. show "offer list" button....etc</div>
<!-- end of scrollable div>
</div><!-- end of ng-view div -->
</body>
</html>
我可以将页脚放在 index.html 文件中的 ng-view 之外，但是如何将范围附加到它？
这是一个“应用程序设计”问题，但我相信有很多用户需要类似的，他们会发现你的想法很有帮助。