ng-model jest zdefiniowana w kontrolerze

Question

Używam jonowe i mam następujący pogląd:

<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> 

i mój Kontroler:

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); 
     } 

    } 
]); 

Co ja nie rozumiem, jest to, że kiedy Klikam przycisk, funkcja logowania jest wywoływana poprawnie. Ponadto, jeśli w kontrolerze przejdę i ustawię $scope.membershipNo na coś takiego jak "Bananowy naleśnik", widok faktycznie się zaktualizuje.

Jednak kiedy funkcja logowania rzeczywiście działa, mówi, że membershipNo i hasło są niezdefiniowane. Jestem całkiem nowy, kątowe i jonowe tak wiem, że to pewnie jakiś n00b pomyłka ...

Answer 1

miałem dokładny ten sam problem niedawno i to prawdopodobnie rozwiązanie: https://stackoverflow.com/a/22768720/552936

Modified cytat:

"Jeśli używasz NG-modelu, trzeba mieć kropkę w środku"
Spraw, aby Twój model wskazywał na object.property, a będziesz gotowy do pracy.

Controller

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

Szablon

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

Answer 2

Trzeba zdefiniować $ zakres zmienne jak to w kontrolerze:

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

więc kontroler będzie wyglądać następująco:

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

Proszę sprawdzić ten kod to pracował dla mnie:

<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> 

oraz w regulator:

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 } 
}