web-dev-qa-db-fra.com

Comment obtenir des données à partir d'une entrée de formulaire

Je suis nouveau dans le développement mobile, en particulier avec Ionic. Sil te plait aide moi

J'ai ce code pour mon itinéraire

.state('auth', {
url: '/auth',
templateUrl: 'templates/login.html',
controller: 'AuthCtrl'

J'ai ce code pour mon login.html

<ion-view view-title="Login" name="login-view">
<ion-content class="padding">
    <div class="list list-inset">
        <label class="item item-input">
            <input type="text" placeholder="Mobile Number" ng-model="mobile_number">
        </label>
        <label class="item item-input">
            <input type="password" placeholder="Password" ng-model="password">
        </label>
    </div>
    <button class="button button-block button-calm" ng-click="login()">Login</button>
</ion-content>

et pour mon AuthCtrl

.controller('AuthCtrl', function($scope,$auth,$state) {

$scope.login = function() {
    var credentials = {
        mobile_number : $scope.mobile_number,
        password : $scope.password,
    }
    console.log(credentials);
    $auth.login(credentials).then(function(data) {
        // If login is successful, redirect to the users state
        $state.go('tab.dash', {});
    });
}

})

J'obtiens toujours cet objet Objet {numéro_mobile: non défini, mot de passe: non défini} lors de l'appel de console.log (informations d'identification) Je mets toujours des valeurs dans mes formulaires, mais c'est toujours non défini. Pourquoi?

angularjsionic-framework
5
markhamknight

Commencez par initialiser votre modèle de références de portée:

$scope.credentials = {
   'mobile_number' : ''
   'password' : '',
 }

Liez ensuite vos entrées aux propriétés de la portée:

<input type="text" placeholder="Mobile Number" ng-model="credentials.mobile_number">


<input type="password" placeholder="Password" ng-model="credentials.password">

Et utilisez $scope.credentials qui contient maintenant vos données de formulaire:

$auth.login($scope.credentials).then(function(data) {
    // If login is successful, redirect to the users state
    $state.go('tab.dash', {});
});
7
Akis Tofas

Votre objet informations d'identification n'est pas lié à la portée. Il semble que vous devez déclarer $ scope.credentials en dehors de la connexion. De plus, ngModel devrait également être lié à credentials.password et credentials.mobile_number. 

2
amuramoto

En fait ça marche bien pour moi, j'ai fait un peu plunker pour le tester. J'étais confronté à un problème similaire car j'avais ajouté les directives ng-pattern et ng-minLength dans l'entrée. Dans ce cas, vous obtiendrez undefined sauf si la valeur d'entrée est un motif et une longueur valides. Pour résoudre ce problème, j'ai ajouté une propriété à votre élément d'entrée

<input type="tel" ng-model="credentials.mobile_number" 
  ng-model-options="{allowInvalid:true}"/>

J'espère que ça aide, bonne chance

1
Abdelrhman Hussien