Question

我正在尝试编写一个具有以下功能的小型Angular应用程序：

表单以占位符文本开头为空。用户在必填文本框中输入项目。 Angular将项目推送到集合。将表单输入重置为默认值。

我的代码看起来像这样（jsfiddle：http://jsfiddle.net/Nn37v/1/）： HTML：

<div ng-controller="MyCtrl">
    <form name="talkForm">
        <input ng-model="newVoice" placeholder="Say something" required />
        <button ng-click="saySomething()">Say</button>
    </form>

    <ul>
        <li ng-repeat="c in conversation">{{c}}</li>
    </ul>
</div>

使用Javascript：

function MyCtrl($scope) {
    $scope.conversation =[];
    $scope.saySomething = function(){
        if ($scope.talkForm.$valid){
            //push to list
            $scope.conversation.push($scope.newVoice);
            $scope.newVoice='';
        }
    }
}

我遇到的问题是当$ scope.newVoice =''执行时，表单无效，我会弹出有用的HTML5验证，以鼓励我正确填写表单。显然这不是我想要的行为 - 使用Angular执行此操作的正确方法是什么？

Answer 1

要删除HTML5验证（因为它只适用于兼容的浏览器），为什么不在表单中添加novalidate属性？

由于“必需”归因，表格的有效性仍然无效。

Answer 2

似乎Angular的1.1.x分支中的以下pull请求将添加$ setPristine方法以允许这种情况发生

https://github.com/angular/angular.js/pull/1127

AngularJs和HTML5需要字段设置字段以清空火灾验证

2 个答案: