要使Angular子元素继承父元素的Flex属性,可以使用以下解决方法:
HTML代码:
CSS代码:
.parent {
display: flex;
}
.child {
flex: inherit;
}
父组件代码:
import { Component } from '@angular/core';
@Component({
selector: 'app-parent',
template: `
`,
styles: [`
.parent {
display: flex;
}
`]
})
export class ParentComponent {
parentFlex = '1';
}
子组件代码:
import { Component, Input } from '@angular/core';
@Component({
selector: 'app-child',
template: ``
})
export class ChildComponent {
@Input() flexValue: string;
}
父组件代码:
import { Component } from '@angular/core';
@Component({
selector: 'app-parent',
template: `
`,
styles: [`
.parent {
display: flex;
}
`]
})
export class ParentComponent {
parentFlex = '1';
}
这些方法中,选择其中一个适合你的使用场景和需求,以实现子元素继承父元素的Flex属性。
上一篇:Angular子域