Benutzer:MovGP0/AngularJS/Validation

MovGP0

Über mich

Hilfen

Artikel

Weblinks

Literatur

Zitate

Notizen

Programmierung

MSCert

Physik

Programmierung Web-Programming Languages ECMAScript • TypeScript • Elm • LESS Infrastruktur Node • Yeoman • Bower • Grunt • Jasmine • Karma • Protractor • Hapi • Redux AngularJS Validation • Testing Angular Modules • Animations • Attributes • Styles • Deployment • Dependency Injection • HTTP Client • Lifecycle • Pipes • Routing and Navigation • Security • Structural Directives (ngIf, ngFor, ngSwitch) • Testing • Forms Validation Other Knockout • RequireJS • PhoneGap/Cordova • React • fantasy-land • typed-contract • parsimmon

AngularJS Validation

• ngModelController = Validierung von einzelnem Feld
• ngFormController = Validierung von Form mit mehreren Feldern

class PassengerController {

  private _passenger: IPassenger;
  private _index: number;
  private _passengersForm : IFormController;

  get viewOnly() {
    return this._viewOnly;
  }
  
  get passengersForm(): any {
    return this._passengersForm;
  }

  static $inject = ["$scope"];
  constructor($scope: IPassengerDirectiveScope) {
    this._passenger = $scope.passenger as IHomeDeliveryFlightBaggagePassenger;
    this._index = $scope.index; // nth element
    this._passengersForm = $scope.passengersForm;
  }
  //...

interface IPassengerDirectiveScope extends angular.IScope {
  passengersForm: angular.IFormController; 
  index: number;
  passenger: IHomeDeliveryFlightBaggagePassenger;
}

angular.module("...", [])
  .directive("myPassenger", (): ng.IDirective => ({
    restrict: "E",  // Dircetive als Element
    scope: {
      passenger: "=", // <my-passenger ng-foreach="p in passengers" passenger="p">
    },
    require: "^form",
    link: (scope: IPassengerDirectiveScope, element: angular.IAugmentedJQuery, attributes: angular.IAttributes, ngFormController: angular.IFormController) => {
      scope.index = scope.$parent.$index;
      scope.passengersForm = ngFormController;
    },
    templateUrl: "components/passenger/passenger.html",
    controller: PassengerController,
    controllerAs: "controller"
  }));

Externe Links

• UI Validate. In: Github. Abgerufen am 3. März 2016 (englisch). 

|}