2、显示数据

显示数据

ng的模版中，默认用双大括号{{}}绑定组件中的变量显示出来

import { Component } from '@angular/core';
@Component({
  selector: 'app-root',
  template: `
    <h1>{{title}}</h1>
    <h2>My favorite hero is: {{myHero}}</h2>
    `,
  styles: [`h1 { color: red }`]
})
export class AppComponent {
  title = 'Tour of Heroes';
  myHero = 'Windstorm';
}

 

模板来源

ng的模版和样式可以是内联（上述示例），也可以是单独的文件

import { Component } from '@angular/core';
@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})
export class AppComponent {
  title = 'Tour of Heroes';
  myHero = 'Windstorm';
}

 

模板中的 HTML

大部分html标签都能在模版中使用，但有一些是毫无意义的：
html body script base