Question

我正在尝试实现基本的角度形式验证。我已经实现了相同的。但我很想知道，如果我不使用ng-model，为什么它不起作用。

plunker的链接以显示相同的行为

Answer 1

ngModel指令包含NgModelController的实例，其中包含用于数据绑定，验证，CSS更新以及值格式化和解析的服务。如果ngModel本身不存在，则验证将不起作用。要使表单验证起作用，您需要使用name属性和表单输入控件（ngModel）发布到范围的表单实例。 Angular文档中的以下描述解释了：

表单是FormController的一个实例。表单实例可以   可选地使用name属性发布到范围中。

类似地，具有ngModel指令的输入控件包含   NgModelController的实例。这样的控件实例可以   使用name属性作为表单实例的属性发布   在输入控件上。 name属性指定的名称   表单实例上的属性。

这意味着表单和控件的内部状态   可以使用标准绑定在视图中进行绑定   原语。

这允许我们使用以下功能扩展上述示例：

用户与a交互后显示的自定义错误消息   控制（即设置$ touch时）显示自定义错误消息   提交表格（提交已设置），即使用户没有   与控件交互

Answer 2

因为没有ng-model，输入元素不会绑定到应用程序范围内的任何内容。

Answer 3

Angular拥有自己的上下文模型。（范围或其他）如果您在Angular世界之外处理表单，表单不能以Angular的角度获取任何信息。

如果您不想使用ng-model，请使用普通的javascript验证方法。

Answer 4

ng-model="value"定义该特定元素的值来自angular的上下文。它检查声明元素的范围中的value。例如，我们有onclick="call()"和ng-click="call()"方法。 onclick事件搜索超出角度上下文的函数，ng-click事件搜索范围中的函数。

<div ng-app="app" ng-controller="Ctr" onclick="call()" ng-click="call()"></div>


<script>
    function call(){
      console.log('out of angular');
    }
    angualr.app('app', function($scope){
     $scope.call = function(){console.log('insode angular')}
    })
</script>

在上面的代码中，如果您删除onclick，则ng-click会在角度内打印＃，如果您删除ng-click，则onclick会打印{ {1}}。如果两者都在那里，两者都将被调用并打印。同样，如果你删除 ng-model ，你将失去对角度上下文中输入值的控制权和$ error，$ invalid不知道要验证什么。

为什么Angular 1表单验证在没有ng-model的情况下不起作用

4 个答案: