yoyo-ng-modulewindy/src/abc/image/image.directive.js

服务于52ABP模板的前端开源的相关组件内容。整合了ng-alain和你NG ZORRO的内容

import { Directive, Input, ElementRef, Renderer2, } from '@angular/core';
import { deepCopy } from 'yoyo-ng-module/util';
import { AdImageConfig } from './image.config';
/**
 * img标签
 * + 支持微信、qq头像规则缩略图规则
 * + 支持移除http&https协议http
 * + 支持增加onerror事件
 */
var ImageDirective = /** @class */ (function () {
    function ImageDirective(el, render, DEF) {
        this.el = el;
        this.render = render;
        this.size = 64;
        this.error = './assets/img/logo.svg';
        this.inited = false;
        Object.assign(this, deepCopy(DEF));
    }
    ImageDirective.prototype.ngOnInit = function () {
        this.update();
        this.updateError();
        this.inited = true;
    };
    ImageDirective.prototype.ngOnChanges = function (changes) {
        if (this.inited) {
            if (changes.error) {
                this.updateError();
            }
            else {
                this.update();
            }
        }
    };
    ImageDirective.prototype.update = function () {
        var newSrc = this.src;
        // region: fix weixin & qq avatar size
        if (newSrc.includes('qlogo.cn')) {
            var arr = newSrc.split('/'), size = arr[arr.length - 1];
            arr[arr.length - 1] =
                size === '0' || +size !== this.size ? this.size.toString() : size;
            newSrc = arr.join('/');
        }
        // endregion
        // region: remove https & http
        var isHttp = newSrc.startsWith('http:'), isHttps = newSrc.startsWith('https:');
        if (isHttp || isHttps)
            newSrc = newSrc.substr(isHttp ? 5 : 6);
        // endregion
        this.render.setAttribute(this.el.nativeElement, 'src', newSrc);
    };
    ImageDirective.prototype.updateError = function () {
        this.render.setAttribute(this.el.nativeElement, 'onerror', "this.src='" + this.error + "';");
    };
    ImageDirective.decorators = [
        { type: Directive, args: [{ selector: '[_src]' },] },
    ];
    /** @nocollapse */
    ImageDirective.ctorParameters = function () { return [
        { type: ElementRef },
        { type: Renderer2 },
        { type: AdImageConfig }
    ]; };
    ImageDirective.propDecorators = {
        src: [{ type: Input, args: ['_src',] }],
        size: [{ type: Input }],
        error: [{ type: Input }]
    };
    return ImageDirective;
}());
export { ImageDirective };
//# sourceMappingURL=image.directive.js.map