모델로 이동하거나 사이드 메뉴에서 다른 페이지로 이동할 때 장치 백 버튼을 등록 취소하는 방법

Question

내 홈 페이지 내에서 registerbackbuttonaction을 덮어 쓰고 내 홈 페이지에서 다른 페이지로 이동하면 unregistering 내 백 버튼 조치 ionViewDidLeave 잘 작동합니다.

문제는 :

나는 사이드 메뉴 항목에 대한 나의 app.component.ts 파일 내부에 this.nav.push("pagename")을 작성했습니다. 이 때문에 나는 다시 장치 다시 버튼을 over ridding 후 장치 다시 버튼 onclick 갈 수 없습니다.

내 전체 응용 프로그램에서 over-ridding back button 기능을 제거하면 예상 한 결과를 얻고 있습니다.

또한 model 페이지를 열면 내 라이프 사이클 이벤트가 트리거되지 않습니다.

여기에 내가 그것을 뒤로 버튼을 등록 취소되지만 모델과 sidemenu 부분이 작동하지 않습니다 밀어 않는 경우

TS는 위의 코드는 잘 작동

initializeBackButtonCustomHandler(){ 

    let self = this 
    this.platform.ready().then(() => { 

    self.unregisterBackButtonAction = self.platform.registerBackButtonAction(() => { 
     if (this.menuCtrl.getOpen() != null) { 
     this.menuCtrl.close(); 
     return 
     }else if(this.modal && this.modal.index === 0) { 
     console.log("invoking modal value") 
     /* closes modal */ 
     // this.modal.dismiss(); 
     this.viewCtrl.dismiss(); 
     return 

     } 
     this.toast = this.toastCtrl.create({ 
     message: "Press back again to exit the app", 
     position: 'bottom', 
     duration: 1500 
     }); 
     this.toast.present(); 
     this.clickCount = this.clickCount + 1; 
     this.toast.onDidDismiss(() => { 
      this.clickCount = 0; 
     }) 

     if(this.clickCount == 2){ 
     this.clickCount = 0; 
     this.toast.dismiss(); 
      this.platform.exitApp(); 
     } 
    }, 10) 
    }); 
    } 


    ionViewDidEnter(){ 
    this.initializeBackButtonCustomHandler(); 

} 

    ionViewDidLeave() { 
    this.unregisterBackButtonAction && this.unregisterBackButtonAction(); 

} 

파일 내 코드입니다.

Answer 1

뒤로 버튼을 등록 취소하는 대신 이전 페이지로 돌아가서 되돌아 갈 수 있고 다시 상태가 없을 때 앱을 종료 할 수 있습니다. 다음 코드가이를 달성하는 데 도움이 될 것으로 생각됩니다.

platform.registerBackButtonAction(()=>{ 
      let nav = this.app.getActiveNav(); 
      if(nav.canGoBack()){ 
       nav.pop(); 
      }else{ 
       let ismodalopened=this.app._appRoot._modalPortal.getActive(); 
       if(ismodalopened){ 
        app.navPop(); 
       }else{ 

        let alertController = this.alertCtrl.create({ 
         title: 'Confirm', 
         message: 'Are you sure you want to exit?', 
         buttons: [{ 
         text: "Exit", 
         handler:() => { platform.exitApp(); } 
         }, { 
         text: "Cancel", 
         role: 'cancel' 
         }] 
        }) 
        alertController.present(); 
       }   
      } 
     }); 

Answer 2

app.component는 특수 구성 요소입니다. 사실 그것은 당신의 전체 어플리케이션이므로, 이온 라이프 사이클 이벤트를 사용할 수 없습니다. 이온 페이지에서만 이러한 이벤트가 발생합니다.

다시 버튼 리스너의 우선 순위를 10에서 0으로 낮추십시오. 여기 내 팀이 app.component에서 구현 한 예제가 있습니다. 또한 최근에 앱을 닫기 전에 모달 팝업을 추가 했습니까?

/** 
* Method will listen for native backButton on Android 
* Back: 
* If not at nav root will perform nav.pop() same as ionic menu back button. 
* Login: 
* Because of the behavior of backButton on mobile we need to force 
* the user back to the Azure logon page if they are not logged in . 
* Close App: 
* If at a root page and android will ask user if want to close app. Then react to yes/no. 
*/ 
public setupMobileBackButtonListener(): void { 
    if (PlatformUtils.isMobile()) { 
     this.platform.registerBackButtonAction(() => { 
      let user = this.memoryStoreProvider.loginMemoryData().data; 
      if (cmp.isUndefinedOrNull(user)) { 
       this.platform.exitApp(); 
      } 

      if (cmp.isDefinedAndNotNull(this.nav) && this.nav.length() === 1) { 
       this.modalProvider.openYesNoActionModal(CLOSE_APPLICATION_QUESTION_MESSAGE).then(result => { 
        if (result === YES_NO_MODAL_YES_SELECTED) { 
         this.platform.exitApp(); // no back pages in queue exit app 
        } 
       }); 
      } else { 
       this.nav.pop(); // backPage 
      } 
     }, 0); 
    } 
} 

공지 0 우선 순위와 우리는 청취자를 죽일 수 없다. 이것의 단점은 ionic back menu 버튼과 같은 기능을하는 추가 논리입니다.