Угловой способ позиционирования дочернего компонента в центре без добавления стиля к элементу td в родительском компоненте

Question

У меня есть родительский и дочерний компоненты. Родительский компонент html - это простая таблица с элементом td. Я хочу расположить дочерний компонент к центру элемента td. Есть ли лучший способ поместить дочерний компонент в центр, не добавляя class = 'centered' к td в parent?

родительский компонент html:

<table>
    <tr>
        <td class="centered">
            <app-courseformat-icon 
                [formatCode]="course.assignedFormat.formatCode"
                [tooltipText]="course.assignedFormat.formatName">
            </app-courseformat-icon>
        </td>  
    </tr>
</table>

app-courseformat-icon является дочернимкомпонент.

Answer 1

Попробуйте:

:host ::ng-deep app-courseformat-icon {
   text-align: center;
 }

Ссылка на этот стек ссылка .