Ionic ngModel 指令未更新控制器中的 $scope.property 值

Question

我定义了以下离子模板：

<ion-view view-title="Home" hide-nav-bar="true">
  <ion-content class="padding">
    <label class="item item-input">
       <input type="text" placeholder="Enter Name" ng-model="name">
    </label>
    <button class="ion-plus-circled button button-block button-positive" ng-click="add()" side="right">
      Add Name
    </button>
 </ion-content>
</ion-view>

我的控制器如下所示：

//home controller
.controller('HomeCtrl',['$scope','$log',
   function($scope,$log){
      $scope.name = null;
      $scope.add = function(){  
         var name = $scope.name;
         if(name != null && name != undefined){
            $log.debug('participant added to list:' + name);
         }else{
            //notify the user that they must enter a valid name
            $log.debug('user entered invalid name');
         }
    };
}])

在 $scope 上调用 add() 时，$scope.name 值为空。

因此，上面的代码和标记将导致记录以下内容。

user entered invalid name

为什么它不从文本框中获取值？

Answer 1

使用此代码：

Html:

<button class="ion-plus-circled button button-block button-positive" ng-click="add(name)" side="right">
    Add Name
</button>

控制器：

 $scope.add = function(name){  
         if(name != null && name != undefined){
            $log.debug('participant added to list:' + name);
         }else{
            //notify the user that they must enter a valid name
            $log.debug('user entered invalid name');
         }
    };

或：

html:

<input type="text" placeholder="Enter Name" ng-model="obj.name">

控制器：

$scope.add = function(){  
         var name = $scope.obj.name;
         if(name != null && name != undefined){
            $log.debug('participant added to list:' + name);
         }else{
            //notify the user that they must enter a valid name
            $log.debug('user entered invalid name');
         }
    };

Ionic ngModel 指令未更新控制器中的 $scope.property 值

Ionic ngModel directive not updating $scope.property value in controller

phonegap-plugins

angularjs

cordova

angularjs-scope

ionic