feat(hideBackButton): hide-back-button attr on ion-navbar

Closes #377

ionic/components/nav-bar/nav-bar.ts

@@ -53,7 +53,7 @@ class BackButtonText extends Ion {
   selector: 'ion-navbar',
   template:
     '<div class="toolbar-inner">' +
-      '<button class="back-button">' +
+      '<button class="back-button" [hidden]="hideBackButton">' +
         '<icon class="back-button-icon" [name]="bbIcon"></icon>' +
         '<span class="back-button-text">' +
           '<span class="back-default">{{bbDefault}}</span>' +
@@ -68,6 +68,9 @@ class BackButtonText extends Ion {
   host: {
     '[hidden]': '_hidden'
   },
+  inputs: [
+    'hideBackButton'
+  ],
   directives: [BackButton, BackButtonText, Icon]
 })
 export class Navbar extends ToolbarBase {
@@ -88,6 +91,13 @@ export class Navbar extends ToolbarBase {
     this.bbDefault = config.get('backButtonText');
   }
 
+  onInit() {
+    let hideBackButton = this.hideBackButton;
+    if (typeof hideBackButton === 'string') {
+      this.hideBackButton = (hideBackButton === '' || hideBackButton === 'true');
+    }
+  }
+
   getBackButtonRef() {
     return this.bbRef;
   }

ionic/components/nav/test/basic/index.ts

@@ -1,6 +1,6 @@
 import {App, NavController} from 'ionic/ionic';
 import {Page, Config, IonicApp} from 'ionic/ionic';
-import {NavParams, NavController} from 'ionic/ionic';
+import {NavParams, NavController, ViewController} from 'ionic/ionic';
 
 
 @Page({
@@ -152,22 +152,27 @@ class PrimaryHeaderPage {
 
 @Page({
   template: `
-    <ion-navbar *navbar>
+    <ion-navbar *navbar hide-back-button>
       <ion-title>Another Page Header</ion-title>
     </ion-navbar>
     <ion-content padding>
+      <p>Back button hidden w/ <code>ion-navbar hide-back-button</code></p>
       <p><button (click)="nav.pop()">Pop</button></p>
       <p><button (click)="pushFullPage()">Push to FullPage</button></p>
       <p><button (click)="pushPrimaryHeaderPage()">Push to PrimaryHeaderPage</button></p>
       <p><button (click)="pushFirstPage()">Push to FirstPage</button></p>
+      <p><button (click)="toggleBackButton()">Toggle hide-back-button</button></p>
     </ion-content>
   `
 })
 class AnotherPage {
   constructor(
-    nav: NavController
+    nav: NavController,
+    viewCtrl: ViewController
   ) {
-    this.nav = nav
+    this.nav = nav;
+    this.viewCtrl = viewCtrl;
+    this.bbHideToggleVal = true;
   }
 
   pushFullPage() {
@@ -181,6 +186,11 @@ class AnotherPage {
   pushFirstPage() {
     this.nav.push(FirstPage);
   }
+
+  toggleBackButton() {
+    this.bbHideToggleVal = !this.bbHideToggleVal
+    this.viewCtrl.hideBackButton(this.bbHideToggleVal);
+  }
 }
 
 

ionic/components/nav/view-controller.ts

@@ -196,6 +196,12 @@ export class ViewController {
     return navbar && navbar.getNativeElement().querySelector('.toolbar-background');
   }
 
+  hideBackButton(shouldHide) {
+    let navbar = this.getNavbar();
+    if (navbar) {
+      navbar.hideBackButton = !!shouldHide;
+    }
+  }
 
   /**
    * The view has loaded. This event only happens once per view being