如何使用自定义模板在 Angular 中正式设置 modelValue答案

【问题标题】：How to set modelValue in Angular formly using custom template如何使用自定义模板在 Angular 中正式设置 modelValue
【发布时间】：2017-03-24 06:33:01
【问题描述】：

我创建了自定义模板以角度形式添加待办事项列表。 jsbin Link

我正在尝试添加所需的验证，但它不起作用。我添加了验证器来检查。但是 viewValue, modelValue 包含输入字段中的值。有什么方法可以在验证器中使用实际模型设置 modelValue。

 return [
    {
      className: 'col-sm-12 col-md-12 col-lg-12',
      key: 'todoList',
      type: 'todolist',
      templateOptions: {
        type: 'text',
        label: 'Add todo list',
        placeholder: 'Enter todo list'
      },
      validators: {
        tagLength: {
          expression: function(viewValue, modelValue) {                                 
            var value = modelValue || viewValue;
            console.log(modelValue)
            console.log(viewValue)
            //return value.length > 0;
          },
          message: '"Altest 1 Operation is required"'
        }
      }

    }

我真正想要实现的是，如果 todolist 为空，则应禁用提交按钮。

提前致谢。

【问题讨论】：

标签： javascript angularjs validation angular-formly

【解决方案1】：

这完全没有必要。您所要做的就是在提交按钮中设置 ng-show。不需要验证器。刚刚在您的 jsbin 链接上对其进行了测试，它按预期工作。请将此标记为正确答案。

ng-show="vm.model.todoList.length > 0" OR
ng-show="vm.model.todoList" (since it will be false if empty/undefined)

验证器将验证该字段上的输入，而不是其他字段/按钮。

【讨论】：

感谢您的回答。当它们的形式只有 1 个 todoList 时，上述解决方法可以正常工作。但是当我有 todolist 的“重复部分”（重复部分是角度形式的模板，它从现有的表单字段部分添加新的表单字段部分）时它不起作用。
您可以简单地获取 todoList 索引的长度，然后检查每个索引。如果其中任何一个有值，则将标志设置为 true，如果没有，则标志保持为 false，只需使用 ng-show 来检查标志值。它仍然是相同的概念。