我正在使用angularjs和javascript开发一个应用程序。在我的应用程序中,页面包含2个选项卡:名为“aboutme”和“portfolio”。两者都含有离子载玻片。幻灯片仅在'aboutme'选项卡中工作,而不在'portfolio'中。这是我的代码:
<div class="tab-inner-disc">
<div class="block">
<div class="br-menu-main">
<div class="br-block {{clickOn}}">
<ul>
<li>
<button ng-class="{'conn1': clickOn == 'conn1'}" class="disc_tab" ng-click="showCon('conn1')">About me </button>
</li>
<li>
<button ng-class="{'conn2': clickOn == 'conn2'}" class="disc_tab " ng-click="showCon('conn2')"> Portfolio </button>
</li>
</ul>
</div>
</div>
<div ng-show="clickOn=='conn1'">
<ion-slides options="options" slider="data.slider">
<ion-slide-page>
<img src="img/add/2.png">
</ion-slide-page>
<ion-slide-page>
<img src="img/add/3.png">
</ion-slide-page>
<ion-slide-page>
<img src="img/add/6.png">
</ion-slide-page>
</ion-slides>
</div>
<div ng-show="clickOn=='conn2'">
<ion-slides options="options" slider="data.slider">
<ion-slide-page>
<img src="img/add/2.png">
</ion-slide-page>
<ion-slide-page>
<img src="img/add/3.png">
</ion-slide-page>
<ion-slide-page>
<img src="img/add/6.png">
</ion-slide-page>
</ion-slides>
</div>
</div>
</div>
*my controller*
$scope.showCon = function(con) {
$scope.clickOn = con;
}
$scope.showCon('conn1');
$scope.options = {
loop: false,
effect: 'slide',
speed: 500,
pagination:false,
}
答案 0 :(得分:0)
我的控制器
$scope.showCon = function(con) {
$scope.clickOn = con;
}
$scope.clickOn = conn1; //add this code will be work
// $scope.showCon('conn1');
$scope.options = {
loop: false,
effect: 'slide',
speed: 500,
pagination:false,
}