[IONIC2 ] ionic2 -input에서 enter key 입력시 폼 전송하기

Extreming X/App_language 2017.05.16 16:55

[IONIC2 ] ionic2 -input에서 enter key 입력시 폼 전송하기 


input에서 enter key 입력시 폼전송하기


(keyup.enter)=   : enter key 입력 시 실행


Template:

<ion-searchbar
      [(ngModel)]="searchQuery"
      [showCancelButton]="true"
      (ionInput)="search($event)"
      (keyup.enter)="someFunction($event)">
</ion-searchbar>

Component TS: someFunction(event: KeyboardEvent) { console.log((<HTMLInputElement>event.target).value); }











.

저작자표시

'Extreming X > App_language' 카테고리의 다른 글

[IONIC2] inappbrowser 예제  (0) 2017.05.17
[IONIC2] 앱 내부에서 웹브라우저 실행하기 - inappbrowser  (0) 2017.05.17
[IONIC2 ] ionic2 -input에서 enter key 입력시 폼 전송하기  (0) 2017.05.16
[IONIC2] IONIC2에서 안드로이드 backbutton 시 액션 적용.  (0) 2017.05.16
[APP] view.ionic.io http://view.ionic.io/  (0) 2017.05.12
ionic2 webview change -> wkwebview  (0) 2017.05.11
Posted by 홍반장水 홍반장水
TAG Enter Key, ionic 2, 폼 전송
댓글 0개가 달렸습니다

[IONIC2] IONIC2에서 안드로이드 backbutton 시 액션 적용.

Extreming X/App_language 2017.05.16 16:03

[IONIC2] IONIC2에서 안드로이드 backbutton 시 액션 적용. 


안드로이드 backButton 버튼 사용시 앱에서 처리. 앱을 종료할 것인지 아닌지 물어봄,. 


app.component.ts 에 적용해보면 된다. 

import ~~~ 
import { App, Platform, ActionSheetController,AlertController } from 'ionic-angular';


      //-- android backbutton process
      platform.registerBackButtonAction(() => {
        let navv = app.getActiveNav();
        if (navv.canGoBack()){ //Can we go back?
          navv.pop();
        }else{
          let confirm = alertCtrl.create({
            title: '앱을 종료하시겠습니까?',
            message: '',  //'OK를 선택하면 앱이 종료됩니다.',
            buttons: [
              {
                text: 'OK',
                handler: () => {
                    platform.exitApp();
                }
              },
              {
                text: 'Cancel',
                handler: () => {
                              //
                }
              }
            ]
          });
          confirm.present();
        }
      });

/*
      //-- 액션 시트를 사용한 예제
      platform.registerBackButtonAction(() => {
          let nav = app.getActiveNav();
          if (nav.canGoBack()){ //Can we go back?
              nav.pop();
          }else{
              let actionSheet = actionSheetCtrl.create({
              title: '앱을 종료하시겠습니까?',
              buttons: [
                  {
                  text: '예, 종료하겠습니다. ',
                      handler: () => {
                          platform.exitApp(); //Exit from app
                      }
                  },{
                      text: '아니오.',
                      role: 'cancel',
                      handler: () => {
                          console.log('Cancel clicked');
                      }
                  }
              ]
              });
              actionSheet.present();
          }
      });
*/


저작자표시

'Extreming X > App_language' 카테고리의 다른 글

[IONIC2] 앱 내부에서 웹브라우저 실행하기 - inappbrowser  (0) 2017.05.17
[IONIC2 ] ionic2 -input에서 enter key 입력시 폼 전송하기  (0) 2017.05.16
[IONIC2] IONIC2에서 안드로이드 backbutton 시 액션 적용.  (0) 2017.05.16
[APP] view.ionic.io http://view.ionic.io/  (0) 2017.05.12
ionic2 webview change -> wkwebview  (0) 2017.05.11
Angular 2와 Ionic 2가 포함 된 모바일 앱 제작  (0) 2017.04.21
Posted by 홍반장水 홍반장水
TAG App, backbutton, hybrid app, ionic 2, 앱
댓글 0개가 달렸습니다

How to create a custom app icon/splash screen in Ionic2

Extreming X/App_language 2017.04.13 20:10
How to create a custom app icon/splash screen in Ionic2



저작자표시

'Extreming X > App_language' 카테고리의 다른 글

Angular 2와 Ionic 2가 포함 된 모바일 앱 제작  (0) 2017.04.21
Automatically Generate Splash Screens and Icons with Ionic CLI  (0) 2017.04.13
How to create a custom app icon/splash screen in Ionic2  (0) 2017.04.13
[APP] cordova ionic install 중 권한에러 발생시  (0) 2017.04.07
ionic, Text to Speech, Cordova  (0) 2017.04.07
[APP] IONIC framework - Angular.js, CLI tool, Android studio  (0) 2017.04.07
Posted by 홍반장水 홍반장水
TAG app icon, ionic 2, Splash
댓글 0개가 달렸습니다