我开始在jsfiddle中使用AngularJS表单,我遇到了一个问题,一个非常简单的表单示例不能正常工作。我所有的是一个命名的形式,它不会出现在范围内的某种原因(我期待一个FormController实例)。
HTML
<div id="mainContainer" ng-app="angularTest" ng-controller="MainCtrl"> <h1>The Form</h1> <form name="theForm"> <input name="myName" type="text" ng-model="model.name" /> <input name="submit" type="submit" /> </form> </div>
JS
var app = angular.module('angularTest',[]); app.controller('MainCtrl',['$scope',function($scope) { $scope.model = { name: 'Model Name' }; console.log($scope.theForm); //displays 'undefined' }]);
我不能在jsfiddle找到很多直接的例子,所以我不知道这是否可能是一些奇怪的交互与网站像它(大多数例子我发现没有使用正式的控制器)。我试过Plunker检查一样好,但我遇到同样的问题。
我相信我错过了一些超级明显的东西,但我看不到很多其他东西要改变或调整。任何帮助是极大的赞赏!
在控制器初始运行后,窗体仅将自身注册到控制器的$ scope。因此,即使一切设置正确,console.log($ scope.theForm)也将返回undefined。
原文链接:https://www.f2er.com/angularjs/146289.html在你的示例中,对窗体的存在做出反应,您可以在窗体上设置一个观察器,以根据其存在设置调试文本:
$scope.$watch('theForm',function(theForm) { if(theForm) { $scope.formDebugText = 'Form in Scope'; } else { $scope.formDebugText = 'Form is Undefined'; } });
这可以在行动在http://jsfiddle.net/9k2Jk/1/看到