如何使用 angular 模式表单触发验证？

Question

您好，我正在使用 angular schema form 并按照说明验证表单字段，但是当我提交时，如果某些字段无效，验证消息不会出现。

这是我的架构：

    vm.schema = {
  "type": "object",
  "title": "Beneficiario",
  "required": [
    "beneficiaries"
  ],
  "properties": {
    "beneficiaries": {
      "type": "array",
      "items": {
        "type": "object",
        "properties": {
          "name": {
            "type": "number",
            "description": "Monto a transferir",
            "minimum": 1,
            "maximum": 500,
            "validationMessage": {
               101: "El valor de este campo debe ser de al menos {{schema.minimum}} Bs",
               103: "{{viewValue}} Bs es mayor que el máximo permitido para una transferencia: {{schema.maximum}} Bs",
               302: "Este campo es requerido"
            }
          },
          "spam": {
            "title": "Spam",
            "type": "boolean",
            "default": true
          },
          "description": {
            "type": "string",
            "maxLength": 20,
            "validationMessage": {
              201: "La longitud máxima permitida es de {{schema.maxLength}} caracteres",
              302: "Este campo es requerido"
            }
          }
        },
        "required": [
          "name",
          "description"
        ]
      }
    }
  }
};

这是我的表格：

    vm.form = [
  {
    "type": "help",
    "helpvalue": "<h4>Transferencias y pagos</h4><h5>Lista de elementos seleccionados</h5>"
  },
  {
    "key": "beneficiaries",
    "title": "Selección",
    "autocomplete": "off",
    "add": null,
    "style": {
      "add": "btn-success"
    },
    "items": [
      {
        "key": "beneficiaries[].name",
        "title": "Monto Bs",
        "feedback": false
      },
      {
        "key": "beneficiaries[].spam",
        "type": "checkbox",
        "title": "Agregar a pagos frecuentes",
        "condition": "model.beneficiaries[arrayIndex].name"
      },
      {
        "key": "beneficiaries[].description",
        "title": "Descripción",
        "feedback": false
      }
    ],
    "startEmpty": true
  },
  {
    "type": "submit",
    "style": "btn-success btn-block",
    "title": "Agregar"
  }
];

我用这个做了一个 plunker：https://plnkr.co/edit/ogaO8MBmNtxYBPHR67NC?p=preview

所以，我需要解决的问题是：当我提交表单时。如果某些字段无效，则不会出现验证消息。如果我点击了无效字段，我需要显示验证消息

Answer 1

好吧，我自己回答。要触发表单验证，您需要使用 $broadcast 来触发它。

我将代码添加到我的控制器中：

vm.submit = function(){
  console.log("submit");
  // First we broadcast an event so all fields validate themselves
  $scope.$broadcast('schemaFormValidate');

  // Then we check if the form is valid
  if (vm.form.$valid) {
    // ... do whatever you need to do with your data.
  }
};

并添加了 ngSubmit 方法。 (ctrl.submit()) 仅此而已，验证出现:)

如果您需要实际操作，我做了一个 plunker：

https://plnkr.co/edit/s7VbHPKNBHXxTCd7eKgZ?p=preview

如何使用 angular 模式表单触发验证？

How to trigger validations with angular schema form?

javascript

angularjs

forms

schema

angular-schema-form