Question

我正在关注angular2官方教程并即将制作“英雄编辑＆＃39;”。在app.component.ts文件中，我有两个类，Hero和AppComponent。

import { Component } from '@angular/core';

@Component({
  selector: 'my-app',
  template: `
    <h1>{{title}}</h1>
    <h2>{{hero.name}} details!</h2>
    <div><label>id: </label>{{hero.id}}</div>
    <div>
      <label>name: </label>
      <input [(ngModel)]="hero.name" placeholder="name">
    </div>
    `
})

export class Hero {
  id: number;
  name: string;
}

export class AppComponent {
  title = 'Tour of Heroes';
  hero: Hero = {
    id: 1,
    name: 'Windstorm'
  };
}

因为AppComponent的成员类型为＆＃39; Hero＆＃39;我认为Hero必须在AppComponent之前声明。但是，奇怪的错误信息如下所示。

EXCEPTION: No Directive annotation found on AppComponent

当我将Hero课程移到AppComponent的下一部分时，它可以工作......我不知道为什么。任何意见，将不胜感激。感谢。

Answer 1

装饰器（例如@Component）处理它们之后的对象。你的代码应该是：

@Component({...})
class Hero {}

@Component({...})
class AppComponent {}

如果你看一下JavaScript例子：

  app.AppComponent =
    ng.core.Component({
    })
    .Class({
    });

你可以看到为什么......

另外，如果您在单个文件中编写多个类，则顺序很重要。 JavaScript是按顺序执行的，如果你要求一些尚未定义的东西，你就会收到错误。

为什么类的顺序在角度2分量中很重要？

1 个答案: