Question

我的Angular2应用程序中有两个类，其中一个扩展另一个，就像这样，文件course.ts中的第一个（加载时为js）

export class Course {
    id:string;
}

第二个在schoolCourse.ts（加载时为js）

import {Course} from "./course";
export class SchoolCourse extends Course {
    code:string;
}

要在浏览器中加载以下CodeJs代码

 <script>
  System.config({
    packages: {
      app: {
        format: 'register',
        defaultExtension: 'js'
      }
    }
  });
  System.import('app/app/boot')
        .then(null, console.error.bind(console));
</script>

当我将SchoolCourse类作为扩展类加载应用程序时，我收到错误

类扩展值undefined不是函数或null

从angular2-polyfills.js

发出

扩展并查看来自

的堆栈跟踪

加载http://localhost:3000/app/app/boot.js时出错在执行（http://localhost:3000/app/courses/schoolCourse.js:15:48）

引用的那一行是js中表示SchoolCourse延伸课程的行。

对我而言，这听起来像是在学校课程之前加载课程的问题，但我可以如此完整，而且我不是SystemJs。

任何人都知道我如何解决这个问题？

Answer 1

您的SchoolCourse班级import是Course班级吗？

import {Course} from './path/to/course';

export class SchoolCourse extends Course {
    code: string;
}

import行应向SystemJS表明必须在Course之前加载SchoolCourse。

要检查的另一件事 - 在浏览器的开发工具中，打开“网络”标签，观察应用加载时的流量。在致电schoolCourse.js之前是否打电话给course.js？

Answer 2

原来这是一个根本不是SystemJs的问题，或者说我认为除了愚蠢之外的事情，开发团队没有观察用户在课程类和SchoolCourse中的相同功能名称类。修复后，一切正常。

所以，弥漫性错误，愚蠢的错误。至少也许这可以帮助别人度过糟糕的一天......

Answer 3

在使用扩展SchoolCourse之前，您忘记导入课程课程了：

import {Course} from './course';

export class SchoolCourse extends Course {
  (...)
}

可能在信息中干扰你的是一个功能是预期的。事实上，虽然在TypeScript和ES6中有一个类关键字，但类与JavaScript构造函数相对应。这就是为什么在运行时期望函数扩展的原因。

在您不导入时，未加载相应的模块（您在浏览器的devtools的“网络”选项卡中看不到http://localhost:3000/app/courses/course.js的调用）并且课程仍未定义。

加载使用SystemJS扩展其他类的类

3 个答案: