ionic2 导航返回按钮

key: ionic2 navBar 自定义返回按钮
ionic2 修改导航的返回按钮事件,通常有两个方法。

方法一:自定义返回按钮

hideBackButton 影藏导航栏自带的返回按钮;
自定义返回按钮替换即可。


  
    
      
    
    Page Title
  


doYourStuff()
{
alert('cowabonga');
this.navCtrl.pop();  // remember to put this to add the back button behavior
}    
方法二:修改按钮的backButtonClick

@ViewChild(Navbar) navBar: Navbar 获取到navBar
修改navBar的 backButtonClick() 事件

@Component({
selector: 'my-page',
template: `

  
    
      MyPage
    
  



  ...

`
})
   export class MyPage {
  @ViewChild(Navbar) navBar: Navbar;
  constructor(private navController: NavController){}
  ionViewDidLoad() {
    this.navBar.backButtonClick = (e:UIEvent)=>{
      // todo something
      this.navController.pop();
    }
  }
}

当然也可以修改返回按钮的文字等

ionic2 导航返回按钮_第1张图片
navbar.ts

你可能感兴趣的:(ionic2 导航返回按钮)