可以将样式表的url动态注入到组件中吗?
就像是:
styleUrls: [ 'stylesheet1.css',this.additionalUrls ]
或(一厢情愿的想法,并注意到这只是假的代码):
export class MyComponent implements dynamicUrls { ngDynamicUrls() { this.inject(['anotherStylesheet.css','anotherStylesheet2.css']); } }
因为如果你能够从样式表1中覆盖某些样式而无需访问它,那么你应该怎么做呢?我唯一的想法是以某种方式拥有动态styleUrls,但我不认为这是甚么可能从我能找到.
有任何想法吗?
解决方法
有可能在某些方面对我来说有用.您可以操纵Angular 2 Component装饰器,创建自己的,并返回Angular的装饰器与您的属性.
import { Component } from '@angular/core'; export interface IComponent { selector: string; template?: string; templateUrl?: string; styles?: string[]; styleUrls?: string[]; directives?: any; providers?: any; encapsulation?: number; } export function CustomComponent( properties: IComponent): Function { let aditionalStyles: string; try { aditionalStyles = require(`path to aditional styles/${ properties.selector }/style/${ properties.selector }.${ GAME }.scss`); properties.styles.push(aditionalStyles); } catch (err) { console.warn(err) } } return Component( properties ); }
在您的组件中,用新的组件替换默认角度2 @Component.
import { CustomComponent } from 'path to CustomComponent'; @CustomComponent({ selector: 'home',templateUrl: './template/home.template.html',styleUrls: [ './style/home.style.scss'] }) export class ......