這里拿 ion-select 做測試
ionViewDidEnter() { // tslint:disable-next-line:variable-name const select_elements = (this.el.nativeElement.querySelectorAll('ion-select')); const styles = ` .select-text { color:red; } `; select_elements.forEach((element) => { this.injectStyles(element, '.select-text', styles); }); } /* 修改樣式的方法 其實可以封裝一個公共的工具類,你們去折騰吧*/ injectStyles( shadowRootElement: HTMLElement, insertBeforeSelector: string, styles: string ) { const root = shadowRootElement.shadowRoot; const newStyleTag = document.createElement('style'); newStyleTag.innerHTML = styles; root.insertBefore(newStyleTag, root.querySelector(insertBeforeSelector)); }
記得導入 ElementRef
import {Component, ElementRef, OnInit} from '@angular/core';