Angular.js Validierungsnachrichten werden nicht angezeigt

Question

Ich habe Angular.js-Projekte in der Vergangenheit durchgeführt, aber dies ist mein erstes Mean-Stack-Projekt. Ich benutze die meanjs.org Vorlage als Ausgangspunkt. Wenn Sie den yo-Generator verwenden, können Sie Module hinzufügen, und es wird ein Modul für Sie mit allen Server- und Client-Modellen, Controllern, Ansichten usw. erstellt.

Ich habe ein Modul namens Company hinzugefügt, das standardmäßig nur hinzugefügt wird ein Namensfeld und macht es erforderlich. Ich habe das Modell im Grunde genommen und zusätzliche Felder hinzugefügt, die es auch erforderlich machen. Ich habe die gleichen Felder zum Formular hinzugefügt. Wenn Sie versuchen, das Formular zu senden, macht es alle erforderlichen Felder, auch die, die ich nicht benötigt, und keiner der Fehler außer der Namensvalidierung erscheint. Hier

ist das Modell

'use strict'; 

/** 
* Module dependencies. 
*/ 
var mongoose = require('mongoose'), 
    Schema = mongoose.Schema; 

/** 
* Company Schema 
*/ 
var CompanySchema = new Schema({ 
    name: { 
    type: String, 
    default: '', 
    required: 'Please fill Company name', 
    trim: true 
    }, 
    address1: { 
    type: String, 
    default: '', 
    required: 'Please fill Company addres', 
    trim: true 
    }, 
    address2: { 
    type: String, 
    default: '', 
    required: false, 
    trim: true 
    }, 
    city: { 
    type: String, 
    default: '', 
    required: 'Please fill Company city', 
    trim: true 
    }, 
    state: { 
    type: String, 
    default: '', 
    required: 'Please fill Company state', 
    trim: true 
    }, 
    zip: { 
    type: String, 
    default: '', 
    required: 'Please fill Company zip code', 
    trim: true 
    }, 
    phone: { 
    type: String, 
    default: '', 
    required: 'Please fill Company phone number', 
    trim: true 
    }, 
    created: { 
    type: Date, 
    default: Date.now 
    }, 
    user: { 
    type: Schema.ObjectId, 
    ref: 'User' 
    } 
}); 

mongoose.model('Company', CompanySchema); 

Und hier ist die Ansicht

<section> 
    <div class="page-header"> 
    <h1>{{vm.company._id ? 'Edit Company' : 'New Company'}}</h1> 
    </div> 
    {{ vm.form.companyForm }} 
    <br /> 
    {{ vm.company }} 
    <div class="col-md-12"> 
    <form name="vm.form.companyForm" class="form-horizontal" ng-submit="vm.save(vm.form.companyForm.$valid)" novalidate> 
     <fieldset> 
     <div class="form-group" show-errors> 
      <label class="control-label" for="name">Name</label> 
      <input name="name" type="text" ng-model="vm.company.name" id="name" class="form-control" placeholder="Name" required> 
      <div ng-messages="vm.form.companyForm.name.$error" role="alert"> 
      <p class="help-block error-text" ng-message="required">Company name is required.</p> 
      </div> 
     </div> 
     <div class="form-group" show-errors ng-class="{ 'has-error': vm.form.companyForm.address1.$invalid }"> 
      <label class="control-label" for="address1">Address 1</label> 
      <input address1="address1" type="text" ng-model="vm.company.address1" id="address1" class="form-control" placeholder="Address" required> 
      <div ng-messages="vm.form.companyForm.address1.$error" role="alert"> 
      <p class="help-block error-text" ng-message="required">Company address is required.</p> 
      </div> 
     </div> 
     <div class="form-group" show-errors> 
      <label class="control-label" for="address2">Address 2</label> 
      <input address2="address2" type="text" ng-model="vm.company.address2" id="address2" class="form-control" placeholder="Address" required> 
     </div> 
     <div class="form-group" show-errors> 
      <label class="control-label" for="city">City</label> 
      <input city="city" type="text" ng-model="vm.company.city" id="city" class="form-control" placeholder="City" required> 
      <div ng-messages="vm.form.companyForm.city.$error" role="alert"> 
      <p class="help-block error-text" ng-message="required">Company city is required.</p> 
      </div> 
     </div> 
     <div class="form-group" show-errors> 
      <label class="control-label" for="state">State</label> 
      <input state="state" type="text" ng-model="vm.company.state" id="state" class="form-control" placeholder="State" required> 
      <div ng-messages="vm.form.companyForm.state.$error" role="alert"> 
      <p class="help-block error-text" ng-message="required">Company state is required.</p> 
      </div> 
     </div> 
     <div class="form-group" show-errors> 
      <label class="control-label" for="zip">Zip Code</label> 
      <input zip="zip" type="text" ng-model="vm.company.zip" id="zip" class="form-control" placeholder="Zip Code" required> 
      <div ng-messages="vm.form.companyForm.zip.$error" role="alert"> 
      <p class="help-block error-text" ng-message="required">Company zip code is required.</p> 
      </div> 
     </div> 
     <div class="form-group" show-errors> 
      <label class="control-label" for="phone">Phone Number</label> 
      <input phone="phone" type="text" ng-model="vm.company.phone" id="phone" class="form-control" placeholder="Phone Number" required> 
      <div ng-messages="vm.form.companyForm.phone.$error" role="alert"> 
      <p class="help-block error-text" ng-message="required">Company phone is required.</p> 
      </div> 
     </div> 
     <div class="form-group"> 
      <button type="submit" class="btn btn-default">{{vm.company._id ? 'Update' : 'Create'}}</button> 
     </div> 
     <div ng-show="vm.error" class="text-danger"> 
      <strong ng-bind="vm.error"></strong> 
     </div> 
     </fieldset> 
    </form> 
    </div> 
</section> 

Answer 1

In Ihrem Modell Sie sagen, dass address2 nicht erforderlich ist:

address2: { 
    type: String, 
    default: '', 
    required: false, 
    trim: true 
    }, 

Aber dann in Ihrem sehen Sie an, dass es erforderlich ist:

<input address2="address2" type="text" ng-model="vm.company.address2" id="address2" class="form-control" placeholder="Address" required> 

Sie müssen required von diesem Eingang entfernen.

Und der Grund, dass nur eine Fehlermeldung angezeigt wird ist dies (und ich zitiere die angular documentation for ng-messages):

standardmäßig nur eine Nachricht zu einem Zeitpunkt angezeigt werden und diese hängt davon ab, die Priorisierung der Nachrichten innerhalb der Vorlage. (Dies kann unter Verwendung der ng-Nachrichten-Mehrfach- oder mehr Attribute auf der Richtlinie Container geändert werden.)

Answer 2

fand ich die Antwort, wie immer es etwas falsch geschrieben war. Ich habe eine Kopie und Paste und änderte gerade den Namen des Feldes. Als ich den Namen geändert habe, habe ich einen Fund gemacht und ersetzt. Dies führte dazu, dass meine Eingabe einen fehlenden Namen hatte. Wenn Sie das erste betrachten, zeigt es address1="address1"

Mein Finden und Ersetzen hatte den Namen ersetzt, was dazu führte, dass alle das Namensschild verloren haben. Sobald ich festgestellt habe, dass alle Fehler aufgetaucht sind.