角度4削除タグではなく、チャイルズ

Question

が、私はこの

<md-card *ngIf="!asButton"> 
    <img src="/assets/something.png"> 
    <span>{{ text }}</span> 
</md-card> 

<button *ngIf="asButton" md-button> 
    <img src="/assets/something.png"> 
    <span>{{ text }}</span> 
</button> 

ような何かをする必要があります。しかし、私は、すべてのテンプレートを繰り返したくない、それを行うには良いオプションがありますか？多分それ

Answer 1

のようなディレクティブか何かで新しいコンポーネントファイル

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

@Component({ 
    selector: 'app-test-page', 
    template: `<img src="/assets/something.png"> 
      <span>{{ text }}</span>`, 
    styleUrls: ['./test-page.component.css'] 
}) 
export class TestPageComponent { 

    text:any='Title'; 

    constructor() { 
    console.log('test page load....'); 
    } 

} 

そして、あなたは「リピートすべてのテンプレートによって何を意味するか、この

<md-card *ngIf="!asButton"> 
    <app-test-page></app-test-page> 
</md-card> 

<button *ngIf="asButton" md-button> 
    <app-test-page></app-test-page> 
</button>