Javascript 在ion幻灯片中设置不同的html文件

我是新来的离子，我必须设置不同的html文件在每个离子幻灯片

<ion-slide>
Here i have to set home.html file
<h3 class="text-center">slide2</h3>
</ion-slide>
<ion-slide>
Here i have to set city.html file
<h3 class="text-center">slide2</h3>
</ion-slide>
<ion-slide>
Here i have to set test.html file
<h3 class="text-center">slide2</h3>
</ion-slide>

这里我必须设置home.html文件
幻灯片2
这里我必须设置city.html文件
幻灯片2
这里我必须设置test.html文件
幻灯片2

也许您正在考虑动态幻灯片盒，即在每张幻灯片中使用ng include：

angular.module（'app'，['ionic']））
.controller（'SlideBoxController'，function（）{
var vm=这个；
vm.items=[
{title:'Item 1'，desc:'Home'，template:'Home.html'}，
{title:'Item 2'，desc:'City'，template:'City.html'}，
{title:'Item 3'，desc:'Test'，template:'Test.html'}
];
vm.onSlideChanged=函数（slideIndex）{
//当幻灯片改变时做些什么
};
})

滑块{
高度：300px；
背景色：#eee；
}
.盒子{
填充：1em；
}

离子滑盒
滑盒
{{item.title}
{{item.desc}}

城市景观
测试视图

您可以使用指令执行此操作

幻灯片2
幻灯片2
幻灯片2

<ion-view title="{{tab.name}}">
    <ion-content class="has-header" padding="true">
        <ion-slide-box>
            <ion-slide>
                <ng-include src="'home.html'"></ng-include>
                <h3 class="text-center">slide2</h3>
            </ion-slide>
            <ion-slide>
                <ng-include src="'city.html'"></ng-include>
                <h3 class="text-center">slide2</h3>
            </ion-slide>
            <ion-slide>
                <ng-include src="'test.html'"></ng-include>
                <h3 class="text-center">slide2</h3>
            </ion-slide>
        </ion-slide-box>
    </ion-content>
</ion-view>