Cześć, w komponencie A mam button, który "łapię" w inny komponent:
<app-b>
<button class="btn jakasKlasa"> napis </button>
</app-b>
W b.component.html:
<div class="content">
<ng-content select="button"></ng-content>
</div>
Chciałbym teraz dodać mu style przy jednoczesnym zachowaniu jego ostylowania z klasy "jakasKlasa", oraz zastosować na nim właściwości z angular-material. Tutaj pojawia się pytanie - czy to w ogóle możliwe? I czy nie ma do tego lepszego rozwiązania?
Co do styli to nie możesz ich po prostu dopisać do selektora .jakas-klasa? Co do Angulara to nie wiem, nigdy nie miałem z nim styczności.
Jesli chcesz cos stylowac w ng-content musisz dodac
Angular encapsulation: ViewEncapsulation.None,
Do komponentu ktory uzywa <ng-content> bo o ile mnie pamiec nie myli <ng-content> jest eager loaded i nie ma css scope z komponentu w ktorym jest uzywany, jak nie pozostaje ci ::ng-deep ktory jest chyba juz depracated choc sam uzywam bo czasami nie ma zbytnio wyjscia, lub inne podejscie to stylowanie takiego content-u w jakims globalnym pliku *.scss czyli
app-b .jakasKlasa {
}
marcio napisał(a):
Jesli chcesz cos stylowac w ng-content musisz dodac
encapsulation: ViewEncapsulation.None,Do komponentu ktory uzywa <ng-content> bo o ile mnie pamiec nie myli <ng-content> jest eager loaded i nie ma css scope z komponentu w ktorym jest uzywany, jak nie pozostaje ci ::ng-deep ktory jest chyba juz depracated choc sam uzywam bo czasami nie ma zbytnio wyjscia, lub inne podejscie to stylowanie takiego content-u w jakims globalnym pliku *.scss czyli
app-b .jakasKlasa { }
Okej, ale chcialbym jeszcze uzyc matTooltip="jakies info" na tym buttonie, to jak mialbym to zrobic?
Zarejestruj się i dołącz do największej społeczności programistów w Polsce.
Otrzymaj wsparcie, dziel się wiedzą i rozwijaj swoje umiejętności z najlepszymi.