我目前正在使用Twitter Bootstrap开发一个AngularJS项目,我正在尝试将我的Bootstrap指令转换为Angular.我决定使用AngularStrap,因为它为Bootstrap-Select提供了支持(我不确定AngularUI是否相同).
tabs example只覆盖了静态html.有没有办法通过AngularStrap或AngularJS动态加载html片段,以便只在单击选项卡时调用它？我的html片段也需要执行javascript.
我之所以这样做是双重的.首先,每个选项卡包含很多内容,我不希望一次加载所有选项卡,这将减慢加载速度.第二个原因是我更喜欢对我的源代码采用更模块化的方法,而不是将所有内容都放在同一个html文件中.
您可以使用
ng-include指令加载html片段.
使用AngularStrap选项卡的示例,您可以使用url切换静态内容以检索html片段. Here is an example基于AngularStrap Tab示例,包含以下关键更改：
1)$scope.tabs现在有一个页面属性,而不是指向template1.html,template2.html或template3.html的内容.
$scope.tabs = [
{title:'Home',page: 'template1.html'},{title:'Profile',page: 'template2.html'},{title:'About',page: 'template3.html'}
];
<div ng-include src="tabs[tabs.activeTab].page"></div>
