我有一個像這樣的子組件：
<img [src]="imageToShow" alt="如何將類傳遞給子組件？">
我想通過父母將課程傳遞給孩子：
<app-image [image]="data.image" ></app-image>
怎么做？
uj5u.com熱心網友回復：
- 您可以將父樣式表匯入到子組件的樣式表中，然后只使用該類。- 如果您想要該類中的特定屬性，您可以根據它是哪個屬性嘗試繼承值......也許可能會起作用。
假設這就是你的意思。如果沒有，查看檔案會有所幫助。
uj5u.com熱心網友回復：
如果您的類是“全域”定義的 - 例如在 styles.css 或您在 angular.json 中指定的任何檔案（在“styles”陣列中），您可以作為 any 傳遞@Input并使用 [ngClass]
//child
@Input() image:string;
@Input() classcss:string;
<img [ngClass]="classcss" [src]="image" alt="如何將類傳遞給子組件？">
//parent
<app-image [image]="data.image" classcss="w-100 shadow"></app-image>
另一種選擇是使用一些類似
//parent
<app-image [image]="data.image" ></app-image>
//parent.css (or styles.css)
.child img{
width:100%;
box-shadow: 0 .5rem 1rem rgba(0,0,0,.15);
}
或者干脆
//parent
<app-image [image]="data.image"></app-image>
//parent.css (or styles.css)
app-image img{ //<--see that use "app-image"
width:100%;
box-shadow: 0 .5rem 1rem rgba(0,0,0,.15);
}
您也可以使用“css 變數”。所以，在 child.css
img {
width: var(--width);
box-shadow: var(--box-shadow)
}
在 parent.css（或 styles.css）中
app-image {
--width: 100%;
--box-shadow: 0 .5rem 1rem rgba(0,0,0,.15);
}
但我不太確定你想要實作什么
轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/409352.html
標籤：