CSS样式没有生效

Question

简要说明：由于某些要求，HTML代码用home.ts编写并加载到home.html。 CSS风格是用home.ts风格组件编写的。

问题：qazxsw poi风格在qazxsw poi代码中没有受到影响。

CSS

HTML

home.ts code:

@Component({
  selector: 'page-home',
  templateUrl: 'home.html',
  styles:[`.p-tag{font-size:20px; color:red;}`]
})
export class HomePage {
code2='';

  constructor(public navCtrl: NavController, private formBuilder: FormBuilder) {

  }

  ionViewDidEnter()
  {
// css .p-tag style is not effecting in below line on html page
   this.code2 = '<p class="p-tag">Html code From ts file.</p>';
  }

}

出于某种原因，我们不能从home.html code:文件中调用

<ion-content>
    <div [innerHtml]="code2 | noSanitize"></div>
</ion-content>

。我们需要在ts中保留css和.scss，如上面的代码所示。

Answer 1

试试下面的代码，我希望它会帮助你。谢谢

参考链接：css

html

Answer 2

在@Component中使用封装：ViewEncapsulation.None如下所示

https://angular.io/guide/component-styles