Angular 6 Firestore: рендеринг строки с тегами HTML ... без отображения тегов - PullRequest
Новая
       15

Angular 6 Firestore: рендеринг строки с тегами HTML ... без отображения тегов

0 голосов
/ 08 октября 2018

Угловой 6

Firestore

У меня есть объект блога article, хранящийся в Firestore.Я использую редактор wysiwyg для редактирования и сохранения article.content, который является строкой, в базе данных.Когда article.content сохранен, он выглядит следующим образом:

"<p>Some content.<p><br><p>More content</p>"

Он также обрабатывается таким образом, без стилизации, показывая все теги HTML.

Как сделать так, чтобы содержимое стилизовалось тегами, а теги не отображались?

Вот код.

# article-detail-component.ts

export class ArticleDetailComponent {
  articlesCollection: AngularFirestoreCollection<Article>;
  article: any;
  id: any;

  constructor (private route: ActivatedRoute,
               private afs: AngularFirestore) {
      this.articlesCollection = this.afs.collection('articles');
      this.route.params.subscribe(params => {
          this.id = params['id'];
      });
      this.articlesCollection.doc(`${this.id}`).ref.get().then((doc) => {
        this.article = doc.data();
      });
  }
}



# article-detail-component.html

<app-ngx-editor [(ngModel)]="article.content"></app-ngx-editor>
<hr>
<div>
  {{article.content}}
</div>

1 Ответ

0 голосов
/ 08 октября 2018

Свяжите данные со свойством innerHTML, чтобы отобразить динамический HTML в представлении: 

<div [innerHTML]="article.content"></div>
...