AngularJS - 无法获得ngFormController附加到$ scope

我目前正在玩AngularJS，我试图让表单验证工作。我读到，如果你给表单一个名称属性，那么表单的ngFormController将作为一个属性出现在$ scope对象上。但我似乎无法得到那个工作。这是我到目前为止的代码：

<body ng-app="myapp"> 

<div ng-controller="MyController" > 
<form name="myFormNg" ng-submit="myForm.submitTheForm()" novalidate> 
    <input type="text" id="name" ng-model="myForm.name" ng-minlength="5" ng-maxlength="12"> Name <br/> 

    <select multiple="true" 
      ng-model="myForm.car" ng-options="obj.id as obj.name group by obj.type for obj in myForm.options"> 
     <option value="" >Please choose a car</option> 
    </select> 

    <input type="submit" value="Submit Form 2"> 
</form> 

</div> 

<script> 
angular.module("myapp", []) 
    .controller("MyController", function($scope, $http) { 
     $scope.myForm = {}; 
     $scope.myForm.name = "Jakob Jenkov"; 
     $scope.myForm.car = ["nissan", "toyota"]; 

     $scope.myForm.options = [ 
      { id : "nissan", name: "Nissan", type : "4 Door" } 
      , { id : "toyota", name: "Toyota", type : "4 Door" } 
      , { id : "fiat" , name: "Fiat" , type : "2 Door" } 
     ]; 

     for(field in $scope) { 
      console.log(" $scope." + field); 
     } 

     console.log("form: (pristine: " + $scope.myFormNg.$pristine + ", dirty: " + $scope.myFormNg.dirty + 
        ", valid: " + $scope.myFormNg.$valid + ", " + $scope.myFormNg.$invalid + ")"); 

     $scope.myForm.submitTheForm = function(item, event) { 
      console.log("--> Submitting form"); 
      var dataObject = { 
       name : $scope.myForm.name 
       ,car : $scope.myForm.car 
      }; 

      var responsePromise = $http.post("/angularjs-examples/json-test-data.jsp", dataObject, {}); 
      responsePromise.success(function(dataFromServer, status, headers, config) { 
       console.log(dataFromServer.title); 
      }); 
      responsePromise.error(function(data, status, headers, config) { 
       alert("Submitting form failed!"); 
      }); 
     } 

    }); 
</script>

我得到的JavaScript控制台以下错误信息：

“错误：$ scope.myFormNg是未定义

来源

2014-01-24 Jakob Jenkov

'$ scope.myFormNg'中的'ng'是什么？ – Sprottenwels

你不应该在寻找$ scope.myFormNg吗？ – Jason

您试图期间访问的FormController 。实例myController的，但在这个时候的FormController尚未实例化并绑定到$范围

试试这个：

console.log("form: (pristine: " + $scope.myFormNg.$pristine + ", dirty: " + $scope.myFormNg.dirty + 
        ", valid: " + $scope.myFormNg.$valid + ", " + $scope.myFormNg.$invalid + ")")

在控制器方法 - 例如在您submitTheForm函数。

来源

2014-01-24 14:32:49 michael

我将代码移到了$ scope.checkForm（）函数中，然后它就起作用了。谢谢！ –

AngularJS - 无法获得ngFormController附加到$ scope

回答

相关问题