Angular 2未在屏幕上显示输出

时间:2016-12-22 10:50:45

标签: angularjs angular

由于我已经开始学习Angular 2,所以我很好地遵循了基本概念。但是当我尝试运行下面的程序时,我没有得到代码中静态设置的值。

import { Component,Input } from '@angular/core';
export class Hero {
  id: number;
  name: string;
}
hero: Hero = {
  id: 1,
  name: 'Windstorm'
};

@Component({
  selector: 'my-app',
 template: '<h1>{{title}}</h1><h2>{{hero.name}} details!</h2><div><label>id: </label>{{hero.id}}</div><div><label>name: </label>{{hero.name}}</div>'

})
export class AppComponent {
  title = 'Tour of Heroes';
  hero = 'Windstorm';
}

有人可以指出我错在哪里,也可以有人展示如何调试Angular代码,这样我就可以很好地学习框架并通过自学来解决复杂的问题并自己解决基本问题?

The output which I got

1 个答案:

答案 0 :(得分:1)

这应该有效

@Component({
  selector: 'my-app',
 template: '<h1>{{title}}</h1><h2>{{hero.name}} details!</h2><div><label>id: </label>{{hero.id}}</div><div><label>name: </label>{{hero.name}}</div>'

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

hero = 'Windowstorm'; {{hero.name}}无效,因为hero没有name属性。 我确定您的浏览器控制台显示错误消息。请将此类错误添加到以后的问题中。