形式 – 简单的AngularJS形式在Scope中未定义

前端之家收集整理的这篇文章主要介绍了形式 – 简单的AngularJS形式在Scope中未定义前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我开始在jsfiddle中使用AngularJS表单,我遇到了一个问题,一个非常简单的表单示例不能正常工作。我所有的是一个命名的形式,它不会出现在范围内的某种原因(我期待一个FormController实例)。

我有一个fiddle设置,下面是基本代码

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。

在你的示例中,对窗体的存在做出反应,您可以在窗体上设置一个观察器,以根据其存在设置调试文本:

$scope.$watch('theForm',function(theForm) {
    if(theForm) { 
        $scope.formDebugText = 'Form in Scope';
    }
    else {
        $scope.formDebugText = 'Form is Undefined';
    }        
});

这可以在行动在http://jsfiddle.net/9k2Jk/1/看到

原文链接:https://www.f2er.com/angularjs/146289.html

猜你在找的Angularjs相关文章