我开始学习angular2,我想要一个带有图片的标题。
这是我的 heading.component.html
<div class="heading">
<img src="../images/header.jpg"/>
</div>
这是我的 heading.component.ts
import {Component} from 'angular2/core';
@Component({
selector: 'header',
templateUrl: './heading.component.html',
styleUrls: ['../style.css']
})
export class HeadingComponent { }
这是我的 app.component.ts
import {Component} from 'angular2/core';
import {HeadingComponent} from './heading.component';
@Component({
selector: 'my-app',
template: `
<header>fgsdgf</header>
`,
styleUrls: ['../style.css']
})
export class AppComponent { }
浏览器中没有显示任何内容。你能给我一个关于如何显示图像的想法吗?谢谢
最佳答案
用这段代码改变你的 app.component.ts
:-
import {Component} from 'angular2/core';
import {HeadingComponent} from './heading.component';
@Component({
selector: 'my-app',
template: `
<header>fgsdgf</header>
`,
styleUrls: ['../style.css'],
directives: [HeadingComponent]
})
export class AppComponent { }
使用前需要在指令列表中添加header
。所以将其添加到组件的指令列表中。
关于css - 使用 templateUrl 显示带有图像的 div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37084387/