可以将样式表的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 ......
