ng-model在控制器中未定义

14 angularjs ionic-framework ionic

我正在使用离子,我有以下观点:

<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>
Run Code Online (Sandbox Code Playgroud)

而我的控制器:

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

    }
]);
Run Code Online (Sandbox Code Playgroud)

我不明白的是,当我点击按钮时,正确调用登录功能.此外,如果在控制器中我去设置$scope.membershipNo类似"Banana Pancake"的东西,视图实际上会更新.

然而,当登录功能实际运行时,会说memberNo和密码未定义.我对Angular和Ionic很新,所以我知道这可能是一些n00b错误...

mba*_*jur 41

我最近遇到了同样的问题,这可能是一个解决方案:https: //stackoverflow.com/a/22768720/552936

修改报价:

"如果你使用ng-model,你必须在那里有一个点."
让你的模特指向一个object.property你会很高兴去.

调节器

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

模板

<input type="text" placeholder="Membership No" ng-model="formData.membershipNo">
<input type="password" placeholder="Password" ng-model="formData.password">
Run Code Online (Sandbox Code Playgroud)

  • 尽管这可以解决问题,但实际上并没有提供为什么它首先失败的答案。 (2认同)
  • 就像@DRobinson说的那样,并且像上面的例子所示,我拿了MembershipNo和密码并将它们包装在'凭证'对象中,现在神奇地一切正常......但是为什么!? (2认同)