角形にエラーメッセージを追加する

Question

私たちはフォームを作成するために、頑強なフォームを使用しています。しかし、ユーザーが無効な入力を入力すると、明確なエラーメッセージが表示されます。ですから、expression：とmessageを使ってバリデーターを作成しましたが、メッセージが表示されません。

   { 
       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> 

しかし、我々は、エラーメッセージが表示表示されません。それは赤色になり、無効なメッセージだけを表示します。

私も、私はこの正確なことを行う例をたくさん見てきましたし、テキストはhttp://angular-formly.com/#/example/intro/codementor

を表示しているとして、私は単純な何かが欠けていますかなり確信している私の問題 http://jsbin.com/weyotudoqu/1/edit?html,js,console,output

を描いjsbinを作成しました

Answer 1

入力の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

で詳細を見ることができます

Answer 2

これを修正することができました。この例で概説されているようにいくつか追加の設定が欠けていたことがわかります http://angular-formly.com/#/example/other/error-summary