我有一个组件,它在应用程序中的两个地方使用过,一个用于列表,另一个用于 slider ,唯一的区别在于 CSS,一个具有更大的 View ,另一个具有更小的 View 和一些其他 CSS 更改。
所以我想在两个地方使用相同的组件并使用不同的外部样式,但为此我需要动态地将 CSS url 添加到组件装饰器中。
这可能吗?如果是怎么办?
最佳答案
如果要更改单个 css 属性,请像这样选择 ngStyle:
<some-element [ngStyle]="{'font-size': styleExp}">...</some-element>
你的 styleExp 可以是像
这样的条件语句 isSmall ? 80% : 100%
如果你想应用样式类,你需要像这样使用 ngClass:
<some-element [ngClass]="{boolExp ? 'first' :'second'}">...</some-element>
<some-element [ngClass]="{'first': boolExp }">...</some-element>
您的 boolExp 必须返回一个 bool 值。您可以对多个类使用不同的组合。
使用上面的 url 作为引用。
Here是另一个用于学习目的的 URL:
关于html - 添加基于条件/输入属性 Angular 2+ 的 CSS 样式 url,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49605190/