AngularJS: Wie setze ich die Eingabe manuell auf $ valid in controller?

Mithilfe der TokenInput plugin und mit AngularJS gebaut-in formController Validierung.

Recht jetzt ich versuche zu prüfen, ob das Feld text enthält, und dann setzen Feld gültig, wenn es funktioniert. Das Problem mit über das plugin es schafft, sein eigenes Eingang und dann ein ul+li für stlying.

Habe ich Zugang zu addItem (formname) und meine capablities in der Steuerung, die ich gerade brauche, um es zu $gültig.

Markup.

<form class="form-horizontal add-inventory-item" name="addItem">
     <input id="capabilities" name="capabilities" token-input data-ng-model="inventoryCapabilitiesAutoComplete" data-on-add="addCapability()" data-on-delete="removeCapability()" required>
     <div class="required" data-ng-show="addItem.capabilities.$error.required" title="Please enter capability."></div>
</form>

JS.

$scope.capabilityValidation = function (capability) {
  if (capability.name !== "") {
    addItem.capabilities.$valid = true;
    addItem.capabilities.$error.required = false;
  } else {
    addItem.capabilities.$valid = false;
    addItem.capabilities.$error.required = true;
  }
};

Ich bin mit den capabilityValidation Funktion, wenn TokenInput hat etwas eingegeben und übergeben das Objekt.

EDIT:

Herausgefunden ng-model auf meine Eingabe ist Zeug und bekommt die autocomplete-Ergebnisse, die ist, warum bekomme ich keine ng-valid funktionieren, da es basiert auf dem Modell.

$scope.inventoryCapabilitiesAutoComplete = {
  options: {
    tokenLimit: null
  },
  source: urlHelper.getAutoComplete('capability')
};

Ich nicht schreiben, dieses AutoVervollständigen-Umsetzung, gibt es eine andere Möglichkeit, dies zu tun, wo ich Sie haben Zugriff auf die ng-model attr und bewegen Sie das Modell Funktion woanders?

InformationsquelleAutor der Frage Christopher Marshall | 2013-03-15

  1. 134

    Können Sie nicht direkt ändern, in eine form Gültigkeit. Wenn alle Nachkommen Eingänge gültig sind, wird die form gültig ist, wenn nicht, dann ist es auch nicht.

    Was Sie tun sollten ist, um die Gültigkeit des input-Elements. Wie so;

    addItem.capabilities.$setValidity("youAreFat", false);

    Nun die Eingabe (und damit form) ist ungültig.
    Sie können auch sehen, welche Fehler verursacht, dass die Ungültigkeitserklärung.

    addItem.capabilities.errors.youAreFat == true;

    InformationsquelleAutor der Antwort Umur Kontacı

  2. 51

    Den Antworten nicht mir helfen, mein problem zu lösen. Nach langer Suche stieß ich auf dieses Teillösung.

    Habe ich endlich mein problem gelöst mit diesem code, um das Eingabefeld manuell ng-invalid (set zu ng-valid festlegen es auf 'true'):

    $scope.myForm.inputName.$setValidity('required', false);

    InformationsquelleAutor der Antwort notMyName

  3. 17

    Stieß ich auf diesen post w/ein ähnliches Problem.
    Mein fix war, um ein hidden-Feld zu halten, mein Status ungültig für mich.

    <input type="hidden" ng-model="vm.application.isValid" required="" />

    In meinem Fall hatte ich eine nullable bool, die eine person hatte, um wählen Sie eine der beiden anderen Schaltflächen. wenn Sie Antwort ja ist, ein Element der Sammlung Hinzugefügt und der Zustand des Tasters ändert. Bis alle Fragen beantwortet, (eine der Tasten in jedem der Paare hat ein klicken, das Formular ist nicht gültig.

    vm.hasHighSchool = function (attended) { 
  vm.application.hasHighSchool = attended;
  applicationSvc.addSchool(attended, 1, vm.application);
}
    <input type="hidden" ng-model="vm.application.hasHighSchool" required="" />
<div class="row">
  <div class="col-lg-3"><label>Did You Attend High School?</label><label class="required" ng-hide="vm.application.hasHighSchool != undefined">*</label></div>
  <div class="col-lg-2">
    <button value="Yes" title="Yes" ng-click="vm.hasHighSchool(true)" class="btn btn-default" ng-class="{'btn-success': vm.application.hasHighSchool == true}">Yes</button>
    <button value="No" title="No" ng-click="vm.hasHighSchool(false)" class="btn btn-default" ng-class="{'btn-success':  vm.application.hasHighSchool == false}">No</button>
  </div>
</div>

    InformationsquelleAutor der Antwort James Fleming

Schreibe einen Kommentar