Угловой декоратор "класс", не импортированный машинописью - PullRequest
Новая
       8

Угловой декоратор "класс", не импортированный машинописью

0 голосов
/ 21 октября 2018

Я разрабатываю угловое приложение и борюсь с классом, который используется только в декораторе.Файл не импортируется перенесенным источником.Скорее всего, он оптимизирован в компиляторе машинописи, потому что он используется только в декораторе.Однако «импортированная» переменная используется в метаданных, даже если она никогда не объявляется (обратите внимание на `typeof firstclass_model_1.FirstClass´ в JS на строке 46, где firstclass_model_1 не определен).

Это ошибка вTypescript или Angular?

Я могу обойти это, используя FirstClass в источнике машинописного текста.

Источник машинописи: 

import { Component, OnInit, Input } from "@angular/core";
import { FirstClass } from "~/shared/firstclass.model";
import { SecondClass } from "~/shared/secondclass.model";
import { DataService } from "~/shared/data.service";

@Component({
    selector: "test-component",
    moduleId: module.id,
    templateUrl: "./test.component.html",
    styleUrls: ['./test.component.css']
})
export class TestComponent implements OnInit {

    tickettypes: TicketType[];

    @Input("first")
    public get first() {
        return this._first;
    };
    public set first(value: FirstClass) {
        this._first = value;
    }
    private _first: FirstClass;

    @Input("second")
    public get second() {
        return this._second;
    };
    public set second(value: SecondClass) {
        this._second = value;
    }
    private _second: SecondClass;

    constructor(
        private dataService: DataService
    ) {
        // Use the component constructor to inject providers.
    }

    ngOnInit(): void {

    }

    itemTap(tickettype: TicketType) {
        let item = new SecondClass( {
            foo: "bar"
        });
        this.dataService.addItem(item);
    }

}

Полный источник: https://pastebin.com/aNrShiVj

Транспортированный JS: 

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var core_1 = require("@angular/core");
var secondclass_model_1 = require("~/shared/secondclass.model");
var data_service_1 = require("~/shared/data.service");
var TestComponent = (function () {
    function TestComponent(dataService) {
        this.dataService = dataService;
        // Use the component constructor to inject providers.
    }
    Object.defineProperty(TestComponent.prototype, "first", {
        get: function () {
            return this._first;
        },
        set: function (value) {
            this._first = value;
        },
        enumerable: true,
        configurable: true
    });
    ;
    Object.defineProperty(TestComponent.prototype, "second", {
        get: function () {
            return this._second;
        },
        set: function (value) {
            this._second = value;
        },
        enumerable: true,
        configurable: true
    });
    ;
    TestComponent.prototype.ngOnInit = function () {
    };
    TestComponent.prototype.itemTap = function (tickettype) {
        var item = new secondclass_model_1.SecondClass({
            foo: "bar"
        });
        this.dataService.addItem(item);
    };
    return TestComponent;
}());
__decorate([
    core_1.Input("first"),
    __metadata("design:type", Object),
    __metadata("design:paramtypes", [typeof (_a = typeof firstclass_model_1.FirstClass !== "undefined" && firstclass_model_1.FirstClass) === "function" && _a || Object])
], TestComponent.prototype, "first", null);
__decorate([
    core_1.Input("second"),
    __metadata("design:type", Object),
    __metadata("design:paramtypes", [typeof (_b = typeof secondclass_model_1.SecondClass !== "undefined" && secondclass_model_1.SecondClass) === "function" && _b || Object])
], TestComponent.prototype, "second", null);
TestComponent = __decorate([
    core_1.Component({
        selector: "test-component",
        moduleId: module.id,
        templateUrl: "./test.component.html",
        styleUrls: ['./test.component.css']
    }),
    __metadata("design:paramtypes", [typeof (_c = typeof data_service_1.DataService !== "undefined" && data_service_1.DataService) === "function" && _c || Object])
], TestComponent);
exports.TestComponent = TestComponent;
var _a, _b, _c;

https://pastebin.com/2KeE0c9p

1 Ответ

0 голосов
/ 21 октября 2018

Следующий упрощенный пример: 

// foo.ts
export class Foo {
    x: string;
}

// code.ts
import { Foo } from "./foo";

function MyDecorator(target: Object, key: PropertyKey) {}

class MyClass {
    @MyDecorator
    get myField() {
        return this._myField;
    }
    set myField(value: Foo) {
        this._myField = value;
    }
    private _myField: Foo;
}

воспроизводит проблему для меня с TypeScript 2.9.2, но не с TypeScript 3.1.3.Пожалуйста, попробуйте обновить TypeScript.(Если ваша версия TypeScript была задержана Angular, похоже, вам повезло: Angular 7 только что был выпущен с поддержкой TypeScript 3.1.)

...