javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2026-03-13 10:22:08 +08:00
Code Issues Packages Projects Releases Wiki Activity

Fixed #167 and #312 - nav bar router issues

Browse Source
This commit is contained in:
Max Lynch
2013-12-16 21:12:32 -06:00
parent 6e62d3789a
commit b97900f7e5
2 changed files with 94 additions and 58 deletions
Download Patch File Download Diff File Expand all files Collapse all files

76
dist/js/ionic-angular.js vendored
View File

@@ -1168,11 +1168,11 @@ angular.module('ionic.ui.navRouter', ['ionic.service.gesture'])
template: '<header class="bar bar-header nav-bar" ng-class="{invisible: !navController.navBar.isVisible}">' +
'<div class="buttons"> ' +
'<button nav-back class="button" ng-if="enableBackButton && showBackButton" ng-class="backButtonClass" ng-bind-html="backButtonLabel"></button>' +
'<button ng-click="button.tap($event)" ng-repeat="button in leftButtons" class="button {{button.type}}" ng-bind-html="button.content"></button>' +
'<button ng-click="button.tap($event)" ng-repeat="button in leftButtons" class="button no-animation {{button.type}}" ng-bind-html="button.content"></button>' +
'</div>' +
'<h1 class="title" ng-bind="currentTitle"></h1>' +
'<div class="buttons" ng-if="rightButtons.length"> ' +
'<button ng-click="button.tap($event)" ng-repeat="button in rightButtons" class="button {{button.type}}" ng-bind-html="button.content"></button>' +
'<button ng-click="button.tap($event)" ng-repeat="button in rightButtons" class="button no-animation {{button.type}}" ng-bind-html="button.content"></button>' +
'</div>' +
'</header>',
link: function($scope, $element, $attr, navCtrl) {
@@ -1234,6 +1234,14 @@ angular.module('ionic.ui.navRouter', ['ionic.service.gesture'])
}
};
$scope.$parent.$on('navRouter.showBackButton', function(e, data) {
$scope.enableBackButton = true;
});
$scope.$parent.$on('navRouter.hideBackButton', function(e, data) {
$scope.enableBackButton = false;
});
// Listen for changes on title change, and update the title
$scope.$parent.$on('navRouter.pageChanged', function(e, data) {
updateHeaderData(data);
@@ -1289,57 +1297,67 @@ angular.module('ionic.ui.navRouter', ['ionic.service.gesture'])
.directive('navPage', ['$parse', function($parse) {
return {
restrict: 'E',
scope: true,
require: '^navRouter',
scope: {
leftButtons: '=',
rightButtons: '=',
title: '=',
icon: '@',
iconOn: '@',
iconOff: '@',
type: '@',
alignTitle: '@',
hideBackButton: '@',
hideNavBar: '@',
animate: '@',
},
link: function($scope, $element, $attr, navCtrl) {
$element.addClass('pane');
$scope.icon = $attr.icon;
$scope.iconOn = $attr.iconOn;
$scope.iconOff = $attr.iconOff;
// Should we hide a back button when this tab is shown
$scope.hideBackButton = $scope.$eval($attr.hideBackButton);
$scope.hideBackButton = $scope.$eval($scope.hideBackButton);
$scope.hideNavBar = $scope.$eval($attr.hideNavBar);
$scope.hideNavBar = $scope.$eval($scope.hideNavBar);
navCtrl.navBar.isVisible = !$scope.hideNavBar;
if($scope.hideBackButton === true) {
$scope.$emit('navRouter.hideBackButton');
} else {
$scope.$emit('navRouter.showBackButton');
}
// Whether we should animate on tab change, also impacts whether we
// tell any parent nav controller to animate
$scope.animate = $scope.$eval($attr.animate);
// Grab whether we should update any parent nav router on tab changes
$scope.doesUpdateNavRouter = $scope.$eval($attr.doesUpdateNavRouter) || true;
$scope.animate = $scope.$eval($scope.animate);
// watch for changes in the left buttons
var leftButtonsGet = $parse($attr.leftButtons);
$scope.$watch(leftButtonsGet, function(value) {
$scope.leftButtons = value;
if($scope.doesUpdateNavRouter) {
$scope.$emit('navRouter.leftButtonsChanged', $scope.leftButtons);
}
$scope.$watch('leftButtons', function(value) {
$scope.$emit('navRouter.leftButtonsChanged', $scope.leftButtons);
});
// watch for changes in the right buttons
var rightButtonsGet = $parse($attr.rightButtons);
$scope.$watch(rightButtonsGet, function(value) {
$scope.rightButtons = value;
if($scope.doesUpdateNavRouter) {
$scope.$emit('navRouter.rightButtonsChanged', $scope.rightButtons);
$scope.$watch('rightButtons', function(val) {
$scope.$emit('navRouter.rightButtonsChanged', $scope.rightButtons);
});
/*
$scope.$watch('hideBackButton', function(value) {
if(value === true) {
navCtrl.hideBackButton();
} else {
navCtrl.showBackButton();
}
});
*/
// watch for changes in the title
var titleGet = $parse($attr.title);
$scope.$watch(titleGet, function(value) {
$scope.title = value;
$scope.$watch('title', function(value) {
$scope.$emit('navRouter.titleChanged', {
title: value,
animate: $scope.animate
});
});
}
};
}])

76
js/ext/angular/src/directive/ionicNavRouter.js vendored
View File

@@ -195,11 +195,11 @@ angular.module('ionic.ui.navRouter', ['ionic.service.gesture'])
template: '<header class="bar bar-header nav-bar" ng-class="{invisible: !navController.navBar.isVisible}">' +
'<div class="buttons"> ' +
'<button nav-back class="button" ng-if="enableBackButton && showBackButton" ng-class="backButtonClass" ng-bind-html="backButtonLabel"></button>' +
'<button ng-click="button.tap($event)" ng-repeat="button in leftButtons" class="button {{button.type}}" ng-bind-html="button.content"></button>' +
'<button ng-click="button.tap($event)" ng-repeat="button in leftButtons" class="button no-animation {{button.type}}" ng-bind-html="button.content"></button>' +
'</div>' +
'<h1 class="title" ng-bind="currentTitle"></h1>' +
'<div class="buttons" ng-if="rightButtons.length"> ' +
'<button ng-click="button.tap($event)" ng-repeat="button in rightButtons" class="button {{button.type}}" ng-bind-html="button.content"></button>' +
'<button ng-click="button.tap($event)" ng-repeat="button in rightButtons" class="button no-animation {{button.type}}" ng-bind-html="button.content"></button>' +
'</div>' +
'</header>',
link: function($scope, $element, $attr, navCtrl) {
@@ -261,6 +261,14 @@ angular.module('ionic.ui.navRouter', ['ionic.service.gesture'])
}
};
$scope.$parent.$on('navRouter.showBackButton', function(e, data) {
$scope.enableBackButton = true;
});
$scope.$parent.$on('navRouter.hideBackButton', function(e, data) {
$scope.enableBackButton = false;
});
// Listen for changes on title change, and update the title
$scope.$parent.$on('navRouter.pageChanged', function(e, data) {
updateHeaderData(data);
@@ -316,57 +324,67 @@ angular.module('ionic.ui.navRouter', ['ionic.service.gesture'])
.directive('navPage', ['$parse', function($parse) {
return {
restrict: 'E',
scope: true,
require: '^navRouter',
scope: {
leftButtons: '=',
rightButtons: '=',
title: '=',
icon: '@',
iconOn: '@',
iconOff: '@',
type: '@',
alignTitle: '@',
hideBackButton: '@',
hideNavBar: '@',
animate: '@',
},
link: function($scope, $element, $attr, navCtrl) {
$element.addClass('pane');
$scope.icon = $attr.icon;
$scope.iconOn = $attr.iconOn;
$scope.iconOff = $attr.iconOff;
// Should we hide a back button when this tab is shown
$scope.hideBackButton = $scope.$eval($attr.hideBackButton);
$scope.hideBackButton = $scope.$eval($scope.hideBackButton);
$scope.hideNavBar = $scope.$eval($attr.hideNavBar);
$scope.hideNavBar = $scope.$eval($scope.hideNavBar);
navCtrl.navBar.isVisible = !$scope.hideNavBar;
if($scope.hideBackButton === true) {
$scope.$emit('navRouter.hideBackButton');
} else {
$scope.$emit('navRouter.showBackButton');
}
// Whether we should animate on tab change, also impacts whether we
// tell any parent nav controller to animate
$scope.animate = $scope.$eval($attr.animate);
// Grab whether we should update any parent nav router on tab changes
$scope.doesUpdateNavRouter = $scope.$eval($attr.doesUpdateNavRouter) || true;
$scope.animate = $scope.$eval($scope.animate);
// watch for changes in the left buttons
var leftButtonsGet = $parse($attr.leftButtons);
$scope.$watch(leftButtonsGet, function(value) {
$scope.leftButtons = value;
if($scope.doesUpdateNavRouter) {
$scope.$emit('navRouter.leftButtonsChanged', $scope.leftButtons);
}
$scope.$watch('leftButtons', function(value) {
$scope.$emit('navRouter.leftButtonsChanged', $scope.leftButtons);
});
// watch for changes in the right buttons
var rightButtonsGet = $parse($attr.rightButtons);
$scope.$watch(rightButtonsGet, function(value) {
$scope.rightButtons = value;
if($scope.doesUpdateNavRouter) {
$scope.$emit('navRouter.rightButtonsChanged', $scope.rightButtons);
$scope.$watch('rightButtons', function(val) {
$scope.$emit('navRouter.rightButtonsChanged', $scope.rightButtons);
});
/*
$scope.$watch('hideBackButton', function(value) {
if(value === true) {
navCtrl.hideBackButton();
} else {
navCtrl.showBackButton();
}
});
*/
// watch for changes in the title
var titleGet = $parse($attr.title);
$scope.$watch(titleGet, function(value) {
$scope.title = value;
$scope.$watch('title', function(value) {
$scope.$emit('navRouter.titleChanged', {
title: value,
animate: $scope.animate
});
});
}
};
}])