Как установить значение ng-шаблона из компонента - PullRequest
Новая
       35

Как установить значение ng-шаблона из компонента

1 голос
/ 18 февраля 2020

У меня есть это в моем HTML файле: 

<div>
  <ng-template  #valueTemplate>

  </ng-template>
</div>

Как я могу установить внутренний Html ng-template, используя мою локальную ссылку #valueTemplate из компонента?

Я пробовал это, но это не работает: 

import { Component, OnInit, ViewChild } from '@angular/core';

@Component({
  selector: 'app-some',
  templateUrl: './some.component.html',
  styleUrls: ['./some.component.css'],
})
export class SomeComponent implements OnInit {
  @ViewChild('valueTemplate', { static: false }) valueTemplate;

  ngOnInit() {
    this.postContentEditContent.innerHTML(data.content); // Doesn't work
    this.postContentEditContent.value(data.content); // Doesn't work
    this.postContentEditContent.setValue(data.content); // Doesn't work
    this.postContentEditContent.textContent(data.content); // Doesn't work
  } 
}

Как я могу установить его значение из компонента?

1 Ответ

2 голосов
/ 18 февраля 2020

<ng-template> не будет создан в DOM, так как это просто шаблон.

Вам следует привязать элемент, который будет создан в DOM, например <div>.

В качестве бонуса вы можете связать, используя свойство innerHTML. 

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

Для этого вам необходимо пометить его как безопасный HTML в компоненте: 

constructor(private sanitizer:DomSanitizer){}

content: string;

ngOnInit(): void {
  this.content = this.sanitizer.bypassSecurityTrustHtml('<p>Hello, world!</p>');
}
...