ionische erhalten Textfeld Wert

Question

Hallo, ich bin neu zu ionischen und ich habe die folgenden HTML-und Js-Code. Ich versuche, den Wert der Benutzereingabe auf Textbox zu erhalten, indem ich auf den Knopf klicke. (Wenn möglich, würde Ich mag es zu speichern, in ein Objekt oder einem lokalen Cache, so dass es den Einsatz im gesamten derselben Sitzung sein könnte)

<ion-navbar *navbar hideBackButton> 
    <ion-title>Welcome</ion-title> 
</ion-navbar> 

<ion-content> 

<ion-list> 

    <ion-item> 
     <ion-label floating>Please enter a nickname</ion-label> 
     <ion-input type="text" value=""></ion-input> 
    </ion-item> 

</ion-list> 

<div padding> 
    <button (click)="login()" primary block>Continue</button> 
</div> 

neben meinem Js Code

import {Component} from "@angular/core"; 
import {MenuController, NavController, Alert} from "ionic-angular"; 
import {Index} from "../index/index"; 

@Component({ 
    templateUrl: 'build/pages/login/login.html' 
}) 
export class Login { 
    static get parameters() { 
     return [[MenuController], [NavController]]; 
    } 

constructor(menu, nav) { 
     this.menu = menu; 
     this.menu.swipeEnable(false); 

     this.nav = nav; 
    } 

    login() { 
     let alert = Alert.create({ 
     title:  'You have entered', 
     message: 'Hello', 
     buttons: [ 
    { 
     text: 'Cancel', 
     handler:() => { 
     console.log('Cancel clicked'); 
     } 
    }, 
    { 
     text: 'Ok', 
     handler:() => { 
     console.log('Ok clicked'); 

        console.log(getElementById('nickname')); 

        // this.menu.swipeEnable(true); 
        // this.nav.pop(Login); 
        // this.nav.setRoot(Index); 
     } 
    } 
    ] 
    }); 

    this.nav.present(alert); 
} 
} 

Answer 1

Ionic arbeitet mit eckigen, die Zwei-Wege-Bindung als Kernprinzip hat. Es gibt viele Möglichkeiten, dies zu erreichen, aber eine Möglichkeit besteht darin, ein Modell eines HTML-Elements zu erstellen. Also, wenn Sie Ihre Eingabe gesetzt ein erdgasbetriebenen Modell

<ion-input type="text" value="" [(ngModel)]="inputName"></ion-input> 

und dann in Ihrem Controller (Klasse) zu haben, musst du

this.inputName; 

Es wird die Wertänderungen von html halten.

Answer 2

Ich bin nicht sicher ionic2 aber in ionischen 1 können wir wie unten tun:

Hier ein Beispiel ist der Wert der Verwendung Eingabetextes in speichern und

<input type="text" ng-model="username"> 
<input type="text" ng-model="password"> 
<button class="button"ng-click="login(username,password)"> submit</button> 

in Ihrem js Datei-Objekt

$scope.login= function(username,password){ 
    console.log(username); 
    console.log(password); 
var loginUser = { 
    "username":username, 
    "password":password 
}; 
console.log(loginUser); 

überprüfen Sie diese Antwort es funktioniert immer für mich.

Answer 3

verwenden:

<input type="text" name="input name" ng-model="variable-to-bind" /> 

Sie variable-to-bind vom Controller $scope zugreifen können.

Zum Beispiel:.

• In Ihrem Fall variable-to-bind ist username, können Sie es wie $scope.username