我有一个组件，其中包含类为hello的元素，该组件在几乎2个组件中呈现，但每个组件都有自己的高度要求。我如何在Angular 中做到这一点。组件没有关系我尝试了封装和全局样式，然后在本地更新，但没有任何工作
qlfbtfca1#
你可以使用@Input（）和条件来处理它。
nqwrtyyt2#
要解决Angular组件中同一个类的不同高度要求，请考虑使用ViewEncapsulation.None并直接在每个组件的styleUrls中应用特定样式。这允许独立的样式而无需封装。
ViewEncapsulation.None
@Component({ standalone: true, selector: 'app-no-encapsulation', template: ``, styles: [''], encapsulation: ViewEncapsulation.None, })
字符串
xfyts7mz3#
你可以发送一个输入参数到组件的高度大小，像小（sm）或中等（md），然后在css中定义两个不同的类样式，如.sm{height: 25px;} .md{height: 60px;}，最后使用NgClass你可以定义哪个类将被应用，所以你会有想要的高度。PD。我建议你使用CSS方法，如BEM，这样高度将是一个修饰符，它会更干净的解决方案。
.sm{height: 25px;} .md{height: 60px;}
3条答案
按热度按时间qlfbtfca1#
你可以使用@Input（）和条件来处理它。
nqwrtyyt2#
要解决Angular组件中同一个类的不同高度要求，请考虑使用
ViewEncapsulation.None并直接在每个组件的styleUrls中应用特定样式。这允许独立的样式而无需封装。
字符串
xfyts7mz3#
你可以发送一个输入参数到组件的高度大小，像小（sm）或中等（md），然后在css中定义两个不同的类样式，如
.sm{height: 25px;} .md{height: 60px;}，最后使用NgClass你可以定义哪个类将被应用，所以你会有想要的高度。PD。我建议你使用CSS方法，如BEM，这样高度将是一个修饰符，它会更干净的解决方案。