angular2从后端配置获取组件css

angular2从后端配置获取组件css,css,angular,typescript,sass,Css,Angular,Typescript,Sass,有没有办法从后端配置获取组件css?像liferay 我有一个组件,该组件提供文本框供用户输入css代码。用户在文本框中输入的任何css都应该反映在组件中 组件html <div> <h1>I am h1 tag<h1> <h2>I am h2 tag<h2> <div> 我是h1标签 我是h2标签 编辑器 输出 export class SomeComponent implements OnInit { col

有没有办法从后端配置获取组件css?像liferay

我有一个组件,该组件提供文本框供用户输入css代码。用户在文本框中输入的任何css都应该反映在组件中

组件html

<div>
<h1>I am h1 tag<h1>
<h2>I am h2 tag<h2>
<div>

我是h1标签
我是h2标签
编辑器

输出

export class SomeComponent implements OnInit {
  color = 'red';
  ngOnInit() {
    const css = `h2 {color: green} img {background: ${this.color}`; // we can get this css from backend also
    const head = document.getElementById('dynamicStyle');
    const style = document.createElement('style');
    style.type = 'text/css';
    style.appendChild(document.createTextNode(css));
    head.appendChild(style);
  }
}

编辑器

输出

export class SomeComponent implements OnInit {
  color = 'red';
  ngOnInit() {
    const css = `h2 {color: green} img {background: ${this.color}`; // we can get this css from backend also
    const head = document.getElementById('dynamicStyle');
    const style = document.createElement('style');
    style.type = 'text/css';
    style.appendChild(document.createTextNode(css));
    head.appendChild(style);
  }
}

没有人回答,所以回答了我自己的问题。其实这很简单。只需创建一个样式标签并应用css

<div id="dynamicStyle">
<h1>I am h1 tag<h1>
<h2>I am h2 tag<h2>
<div>