我使用Angular2,当tryng在同一个Typescript文件中使用两个类时,我遇到了这个问题.
在编译时没有给我任何错误,但是当我尝试执行该页面console.log提供这个错误:
Error: BaseException@http://www.my.app/panel-module/node_modules/@angular/compiler//bundles/compiler.umd.js:5116:27 CompileMetadataResolver</CompileMetadataResolver.prototype.getNgModuleMetadata/<@http://www.my.app/panel-module/node_modules/@angular/compiler//bundles/compiler.umd.js:13274:35 CompileMetadataResolver</CompileMetadataResolver.prototype.getNgModuleMetadata@http://www.my.app/panel-module/node_modules/@angular/compiler//bundles/compiler.umd.js:13261:21 RuntimeCompiler</RuntimeCompiler.prototype._compileComponents@http://www.my.app/panel-module/node_modules/@angular/compiler//bundles/compiler.umd.js:15845:28 RuntimeCompiler</RuntimeCompiler.prototype._compileModuleAndComponents@http://www.my.app/panel-module/node_modules/@angular/compiler//bundles/compiler.umd.js:15769:36 RuntimeCompiler</RuntimeCompiler.prototype.compileModuleAsync@http://www.my.app/panel-module/node_modules/@angular/compiler//bundles/compiler.umd.js:15746:20 PlatformRef_</PlatformRef_.prototype._bootstrapModuleWithZone@http://www.my.app/panel-module/node_modules/@angular/core//bundles/core.umd.js:9991:20 PlatformRef_</PlatformRef_.prototype.bootstrapModule@http://www.my.app/panel-module/node_modules/@angular/core//bundles/core.umd.js:9984:20 @http://www.my.app/panel-module/app/main.js:4:1 @http://www.my.app/panel-module/app/main.js:1:31 @http://www.my.app/panel-module/app/main.js:1:2 Zone</ZoneDelegate</ZoneDelegate.prototype.invoke@http://www.my.app/panel-module/node_modules/zone.js/dist/zone.js:332:20 Zone</Zone</Zone.prototype.run@http://www.my.app/panel-module/node_modules/zone.js/dist/zone.js:225:25 scheduleResolveOrReject/<@http://www.my.app/panel-module/node_modules/zone.js/dist/zone.js:586:53 Zone</ZoneDelegate</ZoneDelegate.prototype.invokeTask@http://www.my.app/panel-module/node_modules/zone.js/dist/zone.js:365:24 Zone</Zone</Zone.prototype.runTask@http://www.my.app/panel-module/node_modules/zone.js/dist/zone.js:265:29 drainMicroTaskQueue@http://www.my.app/panel-module/node_modules/zone.js/dist/zone.js:491:26 F/</g@http://www.my.app/panel-module/node_modules/core-js/client/shim.min.js:8:10016 F/<@http://www.my.app/panel-module/node_modules/core-js/client/shim.min.js:8:10138 a.exports/k@http://www.my.app/panel-module/node_modules/core-js/client/shim.min.js:8:14293 Evaluating http://www.my.app/panel-module/app/main.js Error loading http://www.my.app/panel-module/app/main.js
下面是我的组件typescript文件.
// MyComponent.ts
import { Component,OnInit } from '@angular/core'; @Component({ selector: 'my-app',templateUrl: '/path/to/view',}) export class MyObject { id: number; } export class MyComponent { obj: MyObject; // unecessary code }
您必须更改您的类的顺序,那么在同一个文件中有多个类是没有问题的.
因为在你的情况下,装饰器@Component现在被用于你的类MyObject而不是MyComponent!
因为在你的情况下,装饰器@Component现在被用于你的类MyObject而不是MyComponent!
装饰器@Component需要直接在您的组件定义的前面!
import { Component,OnInit } from '@angular/core'; export class MyObject1 { id: number; } @Component({ selector: 'my-app',}) export class MyComponent { obj: MyObject; // unecessary code } export class MyObject2 { id: number; }