Question

所以，我正在看这段代码：

    template: '\
        <input class="output-input" id="{{fieldName}}-input" name="{{fieldName}}" type="text" maxlength="64" ng-model="item.name" ng-pattern="pattern" ng-required="true" ng-trim="false" ng-disabled="item.save===false">\
        <div class="save-column" ng-if="showSave"><input type="checkbox" ng-model="item.save" ng-disabled="item.save === undefined" ng-checked="(item.save === undefined) || item.save"></div>\
    ',

我非常想清理那个TODO。

表单元素在指令中通过：

生成

import yampy
access_token = 'access_token_id'
attachment = 'C:\\Users\\userdir\\Desktop\\picture.png'
yammer = yampy.Yammer(access_token=access_token)
yammer.client.post('/messages', body="testing_please_ignore", group_id=123233, broadcast=True, attachment1=attachment)

基本功能是：

有多个编辑字段，旁边有一个保存框。
如果字段中包含垃圾，则表单字段$ error.pattern存在。如果该字段为空，则$ error.required存在
我们遍历所有类型的错误，检查生成它的元素是否已启用（因为禁用的框可以保存垃圾内容或为空白），如果它们这样做，那么我们声明表单无效，因此不适合发送。

感觉有一种方法可以解决这个问题，更多的是角度的风格，我想知道它是什么。

Answer 1

您需要通过为其命名来查看表单的所有属性。渲染您的表单名称以查看AngularJS所知道的所有内容。

<form name="myForm">

</form>

{{myForm}}

我认为你还应该要求ngModel，但我不确定你在这做什么。你可以添加小提琴或图片吗？

Answer 2

那不是那样的。控制器需要尽可能少地完成工作。您需要使用指令进行表单验证。该指令描述了字段的行为，然后在模板中调用它：

<form name="myName" novalidate ng-submit="action(myName)">
    <input class="output-input" id="{{fieldName}}-input" name="{{fieldName}}" ng-model="item.name" .... myDirective>
</form>

还需要maxlength，minlength，指令：

angular.module('myModule.directive', [])

.directive('myDirective', function() {
    return {
        restrict: 'A',
        require: 'ngModel',

        link: function(scope, elem, attrs, ctrl) {
            scope.$watch(attrs.ngModel, function(value) {
                 //function checking if field is valid or not
                 scope.myName.item.name.$setValidity('myDirective', isValid);
            });
        }
    }
})

我建议您阅读angularjs手册以获取指令： https://docs.angularjs.org/guide/directive

处理表单验证的“Angular”方式是什么？

2 个答案: