無法從這個HTML代碼中的角度js

Question

中獲取數據，我們獲得輸入文本值併發送到角度控制器 ，以便它們按照代碼中的定義工作。

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

我的服務按照控制器工作

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

    } 
    return regionFactory; 
}); 

Answer 1

您錯過了$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"> 

Answer 2

您已經在窗體區域數據錯過的$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; 
    });