ng-Modell wird in der Steuerung

Question

undefined Ich bin mit ionischen und ich habe die folgende Ansicht:

<ion-view hide-nav-bar="true" ng-controller="loginController" class="login-view"> 
    <ion-content class="padding"> 

    <div class="row row-center"> 
     <div class="col"> 

     <div id="logo"></div> 

     <form> 
      <div class="list"> 
      <label class="item item-input"> 
       <input type="text" placeholder="Membership No" ng-model="membershipNo"> 
      </label> 
      <label class="item item-input"> 
       <input type="password" placeholder="Password" ng-model="password"> 
      </label> 
      </div> 

      <button class="button button-block button-positive button-login" ng-click="login()"> 
      Login 
      </button> 
     </form> 

     </div> 
    </div> 

    </ion-content> 
</ion-view> 

Und mein Controller:

app.controller('loginController', ['$scope', '$localstorage', 
    function($scope, $localstorage) { 

     $scope.membershipNo; 
     $scope.password; 

     $scope.login = function() { 
      console.log("User logged in with membership no: " + $scope.membershipNo + 
    "\n and password: " + $scope.password); 
     } 

    } 
]); 

Was ich nicht verstehe, ist, dass, wenn Ich klicke auf den Button, die Login-Funktion wird korrekt aufgerufen. Auch wenn ich in der Steuerung gehe und 0123.auf etwas wie "Banana Pancake" setze, aktualisiert sich die Ansicht tatsächlich.

Doch wenn die Login-Funktion tatsächlich ausgeführt wird, heißt es, dass membershipNo und password nicht definiert sind. Ich bin ziemlich neu in Winkel- und Ionic damit ich weiß, dies ist wahrscheinlich einige n00b Fehler ...

Answer 1

ich genau das gleiche Problem hatte vor kurzem und das ist wahrscheinlich eine Lösung: https://stackoverflow.com/a/22768720/552936

Modified Zitat:

"Wenn Sie ng-Modell verwenden, müssen Sie dort einen Punkt haben"
Machen Sie Ihr Modell auf eine object.property und Sie werden gut gehen.

-Controller

$scope.formData = {}; 
$scope.login = function() { 
    console.log("User logged in with membership no: " + $scope.formData.membershipNo + 
    "\n and password: " + $scope.formData.password); 
} 

Vorlage

<input type="text" placeholder="Membership No" ng-model="formData.membershipNo"> 
<input type="password" placeholder="Password" ng-model="formData.password"> 

Answer 2

Sie benötigen $ scope Variablen wie dies in Ihrem Controller zu definieren:

$scope.membershipNo = ''; 
$scope.password = ''; 

So Ihre Controller würde wie folgt aussehen:

app.controller('loginController', ['$scope', '$localstorage', 
    function($scope, $localstorage) { 

    $scope.membershipNo = ''; 
    $scope.password = ''; 
    $scope.login = function() { 
    console.log("User logged in with membership no: " + $scope.membershipNo + 
    "\n and password: " + $scope.password); 
    } 

}]); 

Answer 3

Bitte überprüfen Sie diesen Code Dies ist für mich gearbeitet wird:

<div class="row row-center"> 
    <div class="col"> 

    <div id="logo"></div> 

    <form> 
     <div class="list"> 
     <label class="item item-input"> 
      <input type="text" placeholder="Membership No" ng-model="data.membershipNo"> 
     </label> 
     <label class="item item-input"> 
      <input type="password" placeholder="Password" ng-model="data.password"> 
     </label> 
     </div> 

     <button class="button button-block button-positive button-login" ng-click="login()"> 
     Login 
     </button> 
    </form> 

    </div> 
</div> 

und in your-Controller:

app.controller('loginController', ['$scope', 
    function($scope) { 
    $scope.data={}; 
    $scope.login = function() { 
    console.log("User logged in with membership no: " + $scope.data.membershipNo + 
    "\n and password: " + $scope.data.password); 
    } 

}]); 

Answer 4

Hey Jean,Have a look of it your code is working here

 <ion-view ng-app="app" hide-nav-bar="true" ng-controller="loginController" class="login-view"> 
     <ion-content class="padding"> 

     <div class="row row-center"> 
      <div class="col"> 

      <div id="logo"></div> 

      <form> 
       <div class="list"> 
       <label class="item item-input"> 
        <input type="text" placeholder="Membership No" ng-model="membershipNo"> 
       </label> 
       <label class="item item-input"> 
        <input type="password" placeholder="Password" ng-model="password"> 
       </label> 
       </div> 

       <button class="button button-block button-positive button-login" ng-click="login()"> 
       Login 
       </button> 
      </form> 

      </div> 
     </div> 

     </ion-content> 
    </ion-view> 


var app= angular.module("app",[]); 
    app.controller('loginController', ['$scope', 
     function($scope, $localstorage) { 

     $scope.membershipNo; 
     $scope.password; 
     $scope.login = function() { 
     alert("User logged in with membership no: " + ($scope.membershipNo || '') + 
     "\n and password: " + ($scope.password || '')); 
     } 

    }]); 

Answer 5

$scope.user = {}; 
$scope.submitForm = function (isValid) { 
    if (($scope.user.name || '').length > 0){ //Code } 
}