Aurelia&Typescript注入和继承

Question

我正在使用Aurelia和Typescript,我正在尝试实现以下功能:调用一个基类Parent,在调用的类中扩展此类Child,然后Child在另一个类中注入一个实例.这是设置:

//file1

export class Parent {
    constructor() {
        debugger;
    }
}

//file2
import {Parent} from "file1";
export class Child extends Parent {
    constructor() {
        super();
        debugger;
    }
}

//file3
import {inject} from "aurelia-framework";
import {Child} from "file2";

@inject(Child)
export class Home {
    private child: Child;
    constructor(_child: Child) {
        this.child = _child;
        debugger;
    }
}

但是,当我这样做并实例化时Home,我收到以下错误:

Uncaught SyntaxError: Unexpected token <

随着 ERROR [app-router] Router navigation failed, and no previous location could be restored.

现在,第一个错误,Uncaught SyntaxError: Unexpected token <给了我file1.js第一行的参考.(奇怪地包含来自应用程序索引的html代码).

现在,如果我注射出来file3并做出类似这样的事情:

//@inject(Child)
export class Home {
    private child: Child;
    constructor() {
        this.child =  new Child(); //here I don't inject, I just 
//instantiate a new object of type Child - still the same error
        debugger;
    }
}

我得到了完全相同的错误,因此它似乎与注射无关.

那么,我怎么能有一个被调用的基类Parent,在一个被调用的类中扩展这个类Child,然后Child在另一个类中注入一个实例呢？

或者我的方法中的某些东西是不对的？

谢谢!

更新:一个简单的事实new Child()就是要求中断所有内容,如果在加载页面时,在构造函数中调用它,或者它是在按钮上的方法中,则无关紧要.它在装载时破裂.

   buttonMethod(){
     var x = new Child();  //it breakes the same way
}

现在,如果我将Child类移动到同一个文件中Home,file3看起来像这样:

import {inject} from "aurelia-framework";
import {Parent} from "file1";

export class Home {
    child: Child;
    constructor() {
        this.child = new Child();
        debugger;
     }
}


export class Child extends Parent {
    constructor() {
        super();
        debugger;
    }
}

我实例化它就像这样工作.但是,当我尝试注入它时,所以:

import {inject} from "aurelia-framework";
import {Parent} from "file1";

@inject(Child)
export class Home {
    child: Child;
    constructor(_child: Child) {
        this.child = _child;
        debugger;
     }
}


export class Child extends Parent {
    constructor() {
        super();
        debugger;
    }
}

我明白了: inner error: Error: key/value cannot be null or undefined. Are you trying to inject/register something that doesn't exist with DI?

最后我希望将它们放在单独的文件中,但它是一个开始使它工作所以:)谢谢!

Answer 1

好的，所以 Typescript 编译器会找到它file1，因为它位于.csproj文件中，因此不需要完整路径，但在运行时，它Aurelia framework会找到文件（在 Typescript 代码转译之后），例如localhost/file1.js. 因此，您有两种可能性：要么tsd.json在typings文件夹中创建一个（假设您使用的是 AMD 模块系统），在其中设置打字稿定义的绝对路径，要么在导入自定义类型时始终写入完整路径。