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