@crnk/angular-ngrx/binding/crnk.binding.error.js

Angular helper library for ngrx-json-api and crnk:

import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ContentChild, Input, OnDestroy, TemplateRef } from '@angular/core';
import { AbstractControl, NgForm } from '@angular/forms';
import { ResourceError } from 'ngrx-json-api';
import { Path } from '../expression/crnk.expression';
import { Subscription } from 'rxjs/Subscription';
/**
 * Displays the errors of a control. The control instance is selected by passing its expression.
 */
var ControlErrorsComponent = /** @class */ (function () {
    function ControlErrorsComponent(form, cd) {
        this.form = form;
        this.cd = cd;
        this.controlErrors = [];
    }
    Object.defineProperty(ControlErrorsComponent.prototype, "expression", {
        set: function (expression) {
            this._expression = expression;
            this.collectErrors();
        },
        enumerable: true,
        configurable: true
    });
    ControlErrorsComponent.prototype.ngOnDestroy = function () {
        if (this.controlValueSubscription) {
            this.controlValueSubscription.unsubscribe();
            this.controlValueSubscription = null;
        }
        if (this.controlStatusSubscription) {
            this.controlStatusSubscription.unsubscribe();
            this.controlStatusSubscription = null;
        }
        if (this.formSubscription) {
            this.formSubscription.unsubscribe();
            this.formSubscription = null;
        }
        this.control = null;
    };
    ControlErrorsComponent.prototype.initControl = function () {
        var _this = this;
        if (!this.control) {
            var formName = this._expression.toFormName();
            this.control = this.form.controls[formName];
            if (this.control) {
                this.controlValueSubscription = this.control.valueChanges.subscribe(function () { return _this.collectErrors(); });
                this.controlStatusSubscription = this.control.statusChanges.subscribe(function () { return _this.collectErrors(); });
                // no longer needed once we have a reference to the control
                if (this.formSubscription != null) {
                    this.formSubscription.unsubscribe();
                    this.formSubscription = null;
                }
            }
            else if (!this.formSubscription) {
                // listen to form till we have a reference to the control
                this.formSubscription = this.form.valueChanges.subscribe(function () { return _this.collectErrors(); });
            }
        }
    };
    ControlErrorsComponent.prototype.collectErrors = function () {
        this.initControl();
        if (this.control) {
            var newControlErrors = [];
            var errors = this.control.errors;
            for (var errorCode in errors) {
                if (errors.hasOwnProperty(errorCode)) {
                    newControlErrors.push({
                        code: errorCode,
                        data: errors[errorCode]
                    });
                }
            }
            this.controlErrors = newControlErrors;
            this.cd.markForCheck();
        }
        else {
            this.controlErrors = undefined;
        }
    };
    ControlErrorsComponent.decorators = [
        { type: Component, args: [{
                    selector: 'crnk-control-errors',
                    changeDetection: ChangeDetectionStrategy.OnPush,
                    template: "\n\t\t<div *ngFor=\"let error of controlErrors\">\n\t\t\t<ng-container [ngTemplateOutlet]=\"template\"\n\t\t\t\t\t\t  [ngTemplateOutletContext]=\"{errorCode: error.code, errorData: error.data}\"></ng-container>\n\t\t</div>\n\t",
                },] },
    ];
    /** @nocollapse */
    ControlErrorsComponent.ctorParameters = function () { return [
        { type: NgForm, },
        { type: ChangeDetectorRef, },
    ]; };
    ControlErrorsComponent.propDecorators = {
        "template": [{ type: ContentChild, args: [TemplateRef,] },],
        "expression": [{ type: Input },],
    };
    return ControlErrorsComponent;
}());
export { ControlErrorsComponent };
/**
 * Displays the errors for the given field for a resource. The field and resource is passed to this component
 * as expression.
 */
var ResourceErrorsComponent = /** @class */ (function () {
    function ResourceErrorsComponent(cd) {
        this.cd = cd;
        this.pathErrors = [];
    }
    ResourceErrorsComponent.prototype.toPath = function (sourcePointer) {
        var formName = sourcePointer.replace(new RegExp('/', 'g'), '.');
        if (formName.startsWith('.')) {
            formName = formName.substring(1);
        }
        if (formName.endsWith('.')) {
            formName = formName.substring(0, formName.length - 1);
        }
        if (formName.startsWith('data.')) {
            formName = formName.substring(5);
        }
        return formName;
    };
    Object.defineProperty(ResourceErrorsComponent.prototype, "expression", {
        set: function (expression) {
            var path = expression.toString();
            var resource = expression.getResource();
            var pathErrors = [];
            if (resource && resource.errors) {
                var errors = resource.errors;
                for (var _i = 0, errors_1 = errors; _i < errors_1.length; _i++) {
                    var error = errors_1[_i];
                    if (error.source && error.source.pointer && error.code) {
                        var errorPath = this.toPath(error.source.pointer);
                        if (path === errorPath) {
                            pathErrors.push({
                                code: error.code,
                                data: error
                            });
                        }
                    }
                }
            }
            this.pathErrors = pathErrors;
            this.cd.markForCheck();
        },
        enumerable: true,
        configurable: true
    });
    ResourceErrorsComponent.decorators = [
        { type: Component, args: [{
                    selector: 'crnk-resource-errors',
                    changeDetection: ChangeDetectionStrategy.OnPush,
                    template: "\n\t\t<div *ngFor=\"let error of pathErrors\">\n\t\t\t<ng-container [ngTemplateOutlet]=\"template\"\n\t\t\t\t\t\t  [ngTemplateOutletContext]=\"{errorCode: error.code, errorData: error.data}\"></ng-container>\n\t\t</div>\n\t",
                },] },
    ];
    /** @nocollapse */
    ResourceErrorsComponent.ctorParameters = function () { return [
        { type: ChangeDetectorRef, },
    ]; };
    ResourceErrorsComponent.propDecorators = {
        "template": [{ type: ContentChild, args: [TemplateRef,] },],
        "expression": [{ type: Input },],
    };
    return ResourceErrorsComponent;
}());
export { ResourceErrorsComponent };
//# sourceMappingURL=crnk.binding.error.js.map