Настроить md-tab в Angular 2

У меня возникла проблема со стилем компонента md-tab в Angular 2. Я знаю, что Angular 2 Materials все еще находится в разработке, но я хочу знать, есть ли способ настроить это и для пример удалите нижний радиус. Вот такой код:Настроить md-tab в Angular 2

<md-card> 
    <md-tab-group [selectedIndex]="1"> 
     <md-tab> 
     <template md-tab-label> 
      MY FILES 
     </template> 
     </md-tab> 
     <md-tab> 
     <template md-tab-label> 
      ALL FILES 
     </template> 
     </md-tab> 
     <md-tab> 
     <template md-tab-label> 
      MY INTERESTS 
     </template> 
     </md-tab> 
    </md-tab-group> 
</md-card>

источник

2016-10-26 Marcin Sadowski

Осмотрите свой элемент, см. Родственный класс и переопределите его собственным кодом CSS. – trichetriche

Я пробовал такое решение, но когда я вставляю какой-то класс в теги «md-tabs» и «template», то после компиляции у меня нет этих классов, вставленных в сгенерированный код. –

также пытается учить классы, которые этот скомпилированный код уже имеет –

Хорошо, я знаю. Это связано с улучшением, которое дает угловой 2. Мой код находится в другом компоненте, который я разрабатывал, и в этом месте мне нужен стиль. Angular 2 компилирует код таким образом, что я не могу получить доступ к дочернему компоненту стиля в родительском компоненте. Все здесь: angular.io/docs/ts/latest/guide/component-styles.html.

источник

2016-10-26 09:30:12

В компоненте, где вы используете материальные компоненты, добавить код CSS с префиксом /deep/ как это: -

/deep/ .mat-tab-label{ 
     min-width: 25px !important; 
     padding: 5px; 
}

Для зная имя класса требуемого элемента, идут инструменты разработчика соответствующего браузера, и выберите элемент которого вы хотите изменить border-radius. Теперь после получения имени класса сделайте следующее: -

/deep/ .mat-class-name{ 
    border-radius:0 !important; 
}

источник

2017-04-05 04:14:24

Настроить md-tab в Angular 2

ответ

Смежные вопросы