Question

我正在寻找有关如何显示服务器响应的错误的解决方案，这是每个无效提交的响应，因此我想在应用程序级别而不是在控制器中创建错误处理程序。我想在FORM级别和字段级别上显示错误。

我有一个REST API，在发生错误时会返回以下JSON对象：

<h:form id="groupSelectionForm">
    <p:outputLabel value="Momentane Gruppe:" for="groupSelection" />

    <p:selectOneMenu id="groupSelection" value="#{foodPlanManagementBean.selectedGroup}" style="width:150px">
        <f:selectItem itemLabel="-" itemValue="#{null}"/>
        <f:selectItems value="#{foodPlanManagementBean.getGroups()}" var="group" itemLabel="#{group.name}" itemValue="#{group}"/>
        <p:ajax event="change"/>
    </p:selectOneMenu>
</h:form>

如何创建显示错误的服务？

由于

Answer 1

所以，我为另一个答案创建了这个。如果这种设置适合您，请告诉我。这里，错误是在按钮点击后从服务器响应时显示的。你可以相应地修改它。

我已经为该字段提供了一个自定义模板，如下所示：

 formlyConfigProvider.setWrapper({
      name: 'inputWrapper',
  template: '<div ng-class="to.changeColor==\'red\'? \'redBorder\' : \'otherBorder\'"><formly-transclude></formly-transclude>{{to.keyVal}}</div>'
    });

表单元素通过模式格式定义，以允许单独访问每个元素。

vm.schema={
    "schema": {
        "coolValue" : [{
                "key": "coolValue",
                "type": "input",

          "wrapper": ['inputWrapper'],
                "templateOptions": {
                   "type" : "text",
                  "label": 'Cool Value',
                  "keyVal":"",
                  "changeColor":"green"
                }

         }]


    }

};

最后，onSubmit函数

function onSubmit() {

//Do whatever you want here
//Let's say your server returns an error "iNVALID Credentials"
   var response={
  "error": {
    "errors": [
      {
        "domain": "global",
        "reason": "authError",
        "message": "Invalid Credentials",
        "locationType": "header",
        "location": "Authorization",
      }
    ],
    "code": 401,
    "message": "Invalid Credentials"
  }
};
vm.schema.schema.coolValue[0].templateOptions.changeColor="red";
      vm.schema.schema.coolValue[0].templateOptions.keyVal=response.error.message;

    }
  });

您实际上可以从服务器传递任何错误消息或响应。

CSS包含一个用于向字段添加红色border的类。您可以自由禁用此功能。如果您在此区域也需要任何内容，请随意ping。

这是DEMO

服务器端错误处理与角度形式

1 个答案: