我确信这是一个简单的问题,但我一直在试图让它发挥作用。我的标题中有一个按钮,点击后我想触发一个打印的简单函数。我无法通过点击打印!
我将在下面粘贴HTML和JS。我知道控制器已正确连接到html视图。这是一个抽象的状态,因为我也有标签。我开始认为你不能使用控制器来抽象状态?我只想让标题显示在标签
上方HTML:
<ion-header-bar align-title="left" class="bar-positive">
<div class="buttons">
<button class="button" ng-click="clicked()">Seach</button>
<button class="button button-icon icon ion-ios-search-strong" ng-click="showFilterBar()">
</button>
</div>
<h1 class="title">Title</h1>
<div class="buttons">
<button class="button" ng-click="clicked()" >Test</button>
</div>
</ion-header-bar>
<!--
Create tabs with an icon and label, using the tabs-positive style.
Each tab's child <ion-nav-view> directive will have its own
navigation history that also transitions its views in and out.
-->
<ion-tabs class="tabs-striped tabs-top tabs-background-light tabs-color-positive">
<!-- Dashboard Tab -->
<ion-tab title="Status" icon-off="ion-ios-pulse" icon-on="ion-ios-pulse-strong" href="#/tab/home">
<ion-nav-view name="tab-dash"></ion-nav-view>
</ion-tab>
<!-- Chats Tab -->
<ion-tab title="Chats" icon-off="ion-ios-chatboxes-outline" icon-on="ion-ios-chatboxes" href="#/tab/chats">
<ion-nav-view name="tab-chats"></ion-nav-view>
</ion-tab>
<!-- Search Tab -->
<ion-tab title="Search" icon-off="ion-ios-chatboxes-outline" icon-on="ion-ios-chatboxes" href="#/tab/search">
<ion-nav-view name="tab-search"></ion-nav-view>
</ion-tab>
<!-- Account Tab -->
<ion-tab title="Account" icon-off="ion-ios-gear-outline" icon-on="ion-ios-gear" href="#/tab/selfprofile">
<ion-nav-view name="tab-selfprofile"></ion-nav-view>
</ion-tab>
</ion-tabs>
使用Javascript:
.controller('tabCtrl', ['$state', function($scope, $timeout, $ionicFilterBar) {
console.log("tab control is on");
$scope.places = [{name:'New York'}, {name: 'London'}, {name: 'Milan'}, {name:'Paris'}];
$scope.clicked = function() {
console.log("test")
};
$scope.showFilterBar = function () {
console.log("search button pressed");
var filterBarInstance = $ionicFilterBar.show({
cancelText: "<i class='ion-ios-close-outline'></i>",
items: $scope.places,
update: function (filteredItems, filterText) {
$scope.places = filteredItems;
}
});
};
}])
只是显示这是一个抽象的状态:
.state('tab', {
url: '/tab',
abstract: true,
templateUrl: 'templates/tabsL1.html',
controller: 'tabCtrl'
})
提前感谢您的帮助。我尝试在一个页面中手动完成它,它似乎工作。我很困惑,为什么它在这种情况下不起作用,如果有解决方法。