无法从角度js中的html获取数据

时间:2017-07-07 08:20:38

标签: angularjs

在这段HTML代码中,我们得到输入文本值并发送到Angular控制器 所以他们按照代码中的定义开始工作。

    <div class="row" ng-controller="RegionController">

    <div class="col-lg-12" >
    <div class="hpanel">
    <div class="panel-heading">
      <!--  <div panel-tools></div>  -->
        <h2>Region Master Entry</h2>
    </div>
    <div class="panel-body">


        <!--change form name,and submit controller name-->

        <form role="form">

            <div class="form-group">
                <label class="col-sm-2 control-label">Region Name</label>

                <div class="col-sm-10">
                    <input type="text" placeholder="please enter Region name" class="form-control m-b" required name="Region Name" ng-model="formRegionData.region_name" >

                </div>
            </div>

            <div class="form-group">
                <label class="col-sm-2 control-label">Region Code</label>

                <div class="col-sm-10">
                    <input type="text" placeholder="please enter Region code" class="form-control m-b" required name="Region Code" ng-model="formRegionData.region_code">

                </div>
            </div>

            <div class="form-group">
            <div class="col-sm-3">
                <label>Active</label>
            </div>


             <div class="checkbox checkbox-success col-sm-9">
                 <input id="checkbox3" type="checkbox" checked="" ng-model="formRegionData.status">
                 <label for="checkbox3">

                 </label>
             </div>
         </div>

            <div class="form-group">
                <div class="col-sm-4"></div>

                <div class="col-sm-8">
                    <button  class="btn btn-sm btn-primary btn-xl text-right"  type="submit" ng-click="createRegion()"><strong> Save Region </strong></button>
                </div>

            </div>

 {{formRegionData | json}}
        </form>
    </div>
   </div>
   </div>
 </div>

“{{formRegionData | json}}”这将返回HTML输入文本结果但不向控制器发送数据

在Controller中

代码写为

.controller('RegionController', function( $scope , regionService) {
$scope.createRegion = function() {
    debugger;
    vm.processing = true;
    vm.message = '';
    console.log(formRegionData);
    regionService.SaveRegion( formRegionData )
        .then(function(data) {
            debugger;
            //console.log(data);
            //.success(function(data) {
            vm.processing = false;
            vm.storyData = {};
            vm.message = data.message;
        });
  }
  })

我的服务根据Controller

工作
   .factory('regionService',function($http ){
          var regionFactory = {};
    regionFactory.SaveRegion = function(formRegionData) {
    debugger;
            return $http.post('/api/region/', formRegionData);

    }
    return regionFactory;
});

2 个答案:

答案 0 :(得分:0)

您错过了$scope

    $scope.createRegion = function() {
        debugger;
        $scope.processing = true;
        $scope.message = '';
        console.log($scope.formRegionData);
        regionService.SaveRegion($scope.formRegionData )
            .then(function(data) {
                debugger;
                //console.log(data);
                //.success(function(data) {
                $scope.processing = false;
                $scope.storyData = {};
                $scope.message = data.message;
            });
      }
  })

并删除按钮控件中的ng-click="createRegion()",然后在form标记中添加此代码ng-submit。等,

<form ng-submit="createRegion()" role="form">

答案 1 :(得分:0)

您在表单区域数据中遗漏了$scope 这是链接Jsfiddle

<强> JS

angular.module('myApp', ['ngStorage'])
  .controller('RegionController', function($scope, regionService) {
    var vm = this;
    $scope.createRegion = function() {
      debugger;
      vm.processing = true;
      vm.message = '';
      regionService.SaveRegion($scope.formRegionData)
        .then(function(data) {
          debugger;
          //console.log(data);
          //.success(function(data) {
          vm.processing = false;
          vm.storyData = {};
          vm.message = data.message;
        });
    }
  }).factory('regionService', function($http) {
    var regionFactory = {};
    regionFactory.SaveRegion = function(formRegionData) {
      debugger;
      return $http.post('/api/region/', formRegionData);

    }
    return regionFactory;
  });