为什么隐藏的字段值不会传递给控制器​​Ionic v1

时间:2017-06-19 06:36:54

标签: angularjs ionic-framework

您好我在ioinc v1.

中有一个表单
<form name="add-form">
        <input type="hidden" ng-model="data.usersId" ng-value="{{userId}}"/>
        <input type="hidden" ng-model="data.loggedInUserId" ng-value="{{LoggedInUserId}}"/>

        <div class="col col-center">
        <div class="list list-inset1">              
            <label class="item item-input input-field">Send Message:

                <textarea name="comment" id="comment-textarea" cols="6" rows="6" ng-model="data.message">
                </textarea>
                </label> 

            <button ui-sref="app.profile" style="background-color:red;" class="button button-full button-assertive ink" ng-click="sendMessage()">Send</button>

        </div>
        </div>
        </form>

但是点击后我无法获得控制器上面隐藏字段的值

  

未定义

//Controller is.

 $scope.sendMessage = function() {      
  $scope.data.userId = $scope.data.userId;
  $scope.data.loggedInUserId = $scope.data.loggedInUserId;

  $ionicLoading.show();    
   messagingService.storeMessages($scope.data.message,$scope.data.userId,$scope.data.loggedInUserId)

});

任何人都可以帮我解决这个问题吗?

提前致谢

3 个答案:

答案 0 :(得分:0)

$ scope.data是否在表单函数之前在控制器中初始化? 如果不是,可能会导致这种情况。

请尝试以下代码

 $scope.data = {
   'userId'= null,
   'loggedInUserId': "",
   'message'=''

 }
 $scope.sendMessage = function() {      
    $ionicLoading.show();     
    messagingService.storeMessages( 
    $scope.data.message,
    $scope.data.userId,
    $scope.data.loggedInUserId)
   });

答案 1 :(得分:0)

ng-model上的值与ng-value中的值不同。 数据未初始化。

看看它可能有用的代码片段。

angular.module('myApp', []);

angular.module('myApp')
  .controller('MessageController', ['$scope', MessageController]);

function MessageController($scope) {
  $scope.init = function() {
    $scope.data = {};

    //Data initialized on ctrl start:
    $scope.data.userId = "1234";
    $scope.data.loggedInUserId = "test";

  }


  $scope.sendMessage = function() {
    $scope.data.userId = $scope.data.userId;
    $scope.data.loggedInUserId = $scope.data.loggedInUserId;

    console.log('Do something with data', $scope.data.userId, $scope.data.loggedInUserId,
      $scope.data.message);
  }

  $scope.init();

}
<!DOCTYPE html>
<html ng-app="myApp">

<head>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular-route.js"></script>
</head>

<body>
  <div ng-controller="MessageController">
    <form name="add-form">
      <input type="hidden" ng-model="data.usersId" ng-value="{{data.userId}}" />
      <input type="hidden" ng-model="data.loggedInUserId" ng-value="{{data.loggedInUserId}}" />

      <div class="col col-center">
        <div class="list list-inset1">
          <label class="item item-input input-field">Send Message:

                <textarea name="comment" id="comment-textarea" cols="6" rows="6" ng-model="data.message">
                </textarea>
                </label>

          <button style="background-color:red;" class="button button-full button-assertive ink" ng-click="sendMessage()">Send</button>

        </div>
      </div>
    </form>
  </div>
</body>

</html>

答案 2 :(得分:0)

<div ng-app="myApp" ng-controller="myCtrl">
<form name="add-form">
        <input type="hidden" ng-model="data.userId" ng-value="{{userId}}"/>
        <input type="hidden" ng-model="data.loggedInUserId" ng-value="{{LoggedInUserId}}"/>

        <div class="col col-center">
        <div class="list list-inset1">              
            <label class="item item-input input-field">Send Message:

                <textarea name="comment" id="comment-textarea" cols="6" rows="6" ng-model="data.message">
                </textarea>
                </label> 

            <button ui-sref="app.profile" style="background-color:red;" class="button button-full button-assertive ink" ng-click="sendMessage(data)">Send</button>

        </div>
        </div>
        </form>
</div>

并且用于获取数据使用此:

       <script>
                    var app = angular.module('myApp', []);
                    app.controller('myCtrl', ['$scope', function($scope) {
                        $scope.sendMessage = function(data) {     

                      $scope.userId = $scope.data.userId;
                      $scope.loggedInUserId = $scope.data.loggedInUserId;
                      $scope.message = $scope.data.message;

        $ionicLoading.show();    
 messagingService.storeMessages($scope.message,$scope.userId,$scope.loggedInUserId)
                }
       }]);
            </script>