Question

我有一个角度2（或4个相当）应用程序的基本打字稿文件，如下所示：

// imports

@Component({
  selector: 'app-component',
  template: `<div>HELLO</div>` // <- this template
})
export class Component implements OnInit {

  constructor() {}

  ngOnInit() {
  }

}

现在我的问题是：是否可以使用上面的模板，其中包含从变量生成的组件html？

至于更详细的信息：我从我的后端获得一个json对象，其中包含一个属性＆＃34; html＆＃34;它包含我想要显示的整个html文件。我可能会在ngOnInit中加载它，现在我只是不知道如何将角度用于模板。

Answer 1

这是一个简单的组件，只包含div元素。

你可以简单地将div元素的[innerHtml]属性与数据绑定从支持中返回。
在组件类中，我使用ngOnInit生命周期钩子来从后端请求模板。

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


@Component({
  selector: 'my-app',
  template: `
    <div [innerHtml]='myTemplate'>
    </div>
    `
})
export class AppComponent implements OnInit{
  myTemplate = '';

  ngOnInit() {
    setTimeout(() => { 
      this.myTemplate = '<h1> Raed Khalaf </h1>'
    }, 1000);
  }
}

html（模板）由可变数据生成

1 个答案: