Code: Select all
:host {
//some css props and values
}
:host.xyz {
//some props and values
}
:host.pqr {
//some props and values
}
Code: Select all
@Component({
//all component's metadata added.
host: {
class: 'xyz', // how do i use class pqr here ?
}
})
export class Component {
type = input.required(); //signal
}
Code: Select all
ist Alternativ: Ich habe es mit der Verwendung der folgenden Signale andersherum versucht:
nur den Teil der Host-Eigenschaft hinzufügen.
Code: Select all
host: { '[class.xyz]': 'type === "xyz"', '[class.pqr]': 'type === "pqr"' }
Erwartet – Die Klassen sollten auf das Hostelement angewendet werden, wenn wir die Typeingaben basierend auf type = xyz oder type = pqr als Zeichenfolgen übergeben.