после перехода на Angular 6 получить ошибку «i.style не является функцией» в файле JavaScript компонента - PullRequest
0 голосов
/ 28 августа 2018

У нас есть угловой 2 в качестве внешнего интерфейса и .net core 1.1 в качестве внутреннего интерфейса в нашем приложении. После миграции на angular 6 и .net core 2.1.1 я получаю сообщение об ошибке «i.style не является функцией». Мой компонент и файл component.js выглядят следующим образом. Я импортирую триггер, состояние, переход из @ angular / animations.

P.S .: - мы не используем angular-cli в нашем приложении.

  Component File
 import { Component, ViewChild, ElementRef, OnInit } from "@angular/core";
import {
    trigger, state, transition, animate, style
} from "@angular/animations";
import { ActivatedRoute } from '@angular/router';
import { LaunchApplicationService } from "./../services/launchApplication.service";
import { LaunchApplication } from "./../model/launch-application";
import { IHttpServiceResponse } from "./../services/base/httpServiceResponse.interface";
import { AlertService } from "./../services/alert.service";
import { ProxyAppLaunchRequestResponse } from "./../model/proxy-app-launch-request-response";

@Component({
    selector: "proxy-app-launcher",
    template: require("./proxy-app-launcher.component.html"),
    styles: [require("./proxy-app-launcher.component.css")],
    animations: [
        trigger("showErrorLabel", [
            state("show", style({ filter: "blur(0px)", opacity: 0.85 })),
            state("hide", style({ filter: "blur(10px)", opacity: 0.0 })),
            transition("hide => show", [
                animate("750ms ease-in")
            ]),
            transition("show => hide", [
                animate("100ms ease-out")
            ])
        ]),
    ]
})
export class ProxyAppLauncherCompontent implements OnInit {

    @ViewChild("proxyAppIframe") proxyAppIframe: ElementRef;
    private errorLabelState: string = "hide";
    private launchApplicationUuid: string;
    private proxyAppLaunchUrl: string;

    constructor(private route: ActivatedRoute,
                private alertService: AlertService,
                private launchApplicationService: LaunchApplicationService) {

    }

    ngOnInit() {
        this.launchApplicationUuid = this.route.snapshot.params["launchApplicationUuid"];
    }

    ngAfterViewInit() {
        this.getLaunchApplication(this.launchApplicationUuid);
    }

    private getLaunchApplication(launchApplicationUuid: string): void {
        this.errorLabelState = "hide";
        if (!launchApplicationUuid) throw new Error("launchApplicationUuid is required.");
        let onGetProxyAppLaunchArgs = (serviceResponse: IHttpServiceResponse<ProxyAppLaunchRequestResponse>) => {
            if (serviceResponse.responseValue) {
                this.proxyAppLaunchUrl = serviceResponse.responseValue.LaunchUrl;
                this.proxyAppIframe.nativeElement["src"] = this.proxyAppLaunchUrl;
            }
            else 
            {
                this.errorLabelState = "show";
                this.alertService.error("An error was encountered attempting to load the requested LaunchApplication.");
            }
        };
        this.launchApplicationService.GetProxyAppLaunchArgs(launchApplicationUuid, onGetProxyAppLaunchArgs);
    }

    private showErrorLabel() {
        this.errorLabelState = "show";
    }

    private hideErrorLabel() {
        this.errorLabelState = "hide";
    }
}
   Js code where getting the error
   ProxyAppLauncherCompontent = __decorate([
    core_1.Component({
        selector: "proxy-app-launcher",
        template: require("./proxy-app-launcher.component.html"),
        styles: [require("./proxy-app-launcher.component.css")],
        animations: [
            core_1.trigger("showErrorLabel", [
                core_1.state("show", core_1.style({ filter: "blur(0px)", opacity: 0.85 })),
                core_1.state("hide", core_1.style({ filter: "blur(10px)", opacity: 0.0 })),
                core_1.transition("hide => show", [
                    core_1.animate("750ms ease-in")
                ]),
                core_1.transition("show => hide", [
                    core_1.animate("100ms ease-out")
                ])
            ]),
        ]
    }),
...