将错误消息添加到 angular-formly

Question

我们正在使用 angluar-formly 表单来制作我们的表单。但是，当用户输入无效输入时，我们希望他们有一条明确的错误消息。所以我使用表达式创建了一个验证器：和消息：但是我无法显示消息。

控制器字段值包含：

             {
                key: 'port',
                defaultValue: 2301,
                type: 'input',
                validators: {
                  isPort: {
                    expression : function(viewValue, modelValue) {
                        var value = modelValue || viewValue;
                        return !value || (/^\d+$/.test(value) && value!='' && value>0 && value<65535);
                      },
                    message: '$viewValue +" is not a valid port"'
                  }
                },
                templateOptions: {
                    type: 'number',
                    required: true,
                    label: 'Port',
                    placeholder: 'Enter Port'
                }
              }

然后我们调用 html 代码中的字段：

<formly-form model="execServers" fields="informationFields" form="form2"></formly-form>

但是我们没有看到错误消息出现。它确实变红并显示无效，只是没有消息。

我还创建了一个描述我的问题的 jsbin http://jsbin.com/weyotudoqu/1/edit?html,js,console,output

我很确定我只是遗漏了一些简单的东西，因为我看过很多做这件事的例子，并显示了文本 http://angular-formly.com/#/example/intro/codementor

Answer 1

我能够解决这个问题。我意识到我遗漏了本示例中概述的一些其他配置 http://angular-formly.com/#/example/other/error-summary

Answer 2

我认为它没有显示，因为你没有设置在输入html中显示错误。像这样：

<md-input-container class="md-block">
    <label>{{to.label}}</label>
    <input ng-model="model[options.key]">
    <div class="my-messages" ng-messages="options.formControl.$error" ng-if="options.validation.errorExistsAndShouldBeVisible">
    <div class="error-message" ng-message="{{::name}}" ng-repeat="(name, message) in ::options.validation.messages">
            {{message(options.formControl.$viewValue, options.formControl.$modelValue, this)}}
        </div>
    </div>
</md-input-container>

详情请见http://angular-formly.com/#/example/advanced/validators

将错误消息添加到 angular-formly

Adding error messages to angular-formly

validation

angular-formly