htmlは内側の2角形からレンダリングされません

Question

私は、私のページに応じて私のヘッダーの内容を動的に変更するサービスを使用していますが、コンポーネントにHTMLを置くとブラウザでレンダリングされません

home.component.ts

import { Component, OnInit } from '@angular/core'; 
import { HeaderTitleService } from '../../services/headerTitle.service'; 

@Component({ 
    selector: 'app-home', 
    templateUrl: './home.component.html', 
    styleUrls: ['./home.component.scss'] 
}) 
export class HomeComponent implements OnInit { 

    constructor(
    private headerTitleService: HeaderTitleService 
) { } 

    ngOnInit() { 
    this.headerTitleService.setTitle(` 
     We strive to create things 
     <br> that are engaging, progressive 
     <br> &amp; above all 
     <span class="highlight"> 
     <em>innovative.</em> 
     </span> 
    `); 
    } 

} 

header.component.ts

import { Component, OnInit } from '@angular/core'; 
import { HeaderTitleService } from '../../../services/headerTitle.service' 

@Component({ 
    selector: 'app-header', 
    templateUrl: './header.component.html', 
    styleUrls: ['./header.component.scss'] 
}) 
export class HeaderComponent implements OnInit { 
    title: any; 

    constructor(
    private headerTitleService: HeaderTitleService 
) { } 

    ngOnInit() { 
    this.headerTitleService.title.subscribe(updatedTitle => { 
     this.title = updatedTitle; 
    }); 
    } 

} 

（以下の例を参照） 10

header.component.html

<h1>{{title}}</h1> 

ので、イムは、私がレンダリングされるようにしたい、それにhtmlタグを持った文字列にタイトルを設定しようとしているが、何が起こるかは、全体のことが出てくるとされますそれが私のhome.component.htmlに入れていたように見えるのではなく、文字列を返します。

私はこれを行う方法がありますか？

Answer 1

あなたは、これが働いはい

<h1 [innerHtml]="title"></h1> 

Example