Угловой материал, как установить mat-sort-header из mat-table
85
7
У меня есть следующая таблица из углового материала:
<mat-table *ngIf="!waiting" class="table-general table-summary" #table [dataSource]="dataSource" matSort>
<mat-header-row class="header_row" *matHeaderRowDef="headerKeys"></mat-header-row>
<mat-row class="row" *matRowDef="let row; columns: headerKeys;"></mat-row>
<ng-container *ngFor="let key of headerKeys; let i = index">
<ng-container matColumnDef="{{key}}">
<mat-header-cell class="header_name header_{{key}}" *matHeaderCellDef mat-sort-header> {{getHeaderName(key)}} </mat-header-cell>
<mat-cell class="cell cell_{{key}}" *matCellDef="let row">
<div class="box_cell {{key}}">
<div class="current_value ellipsis" *ngIf="key=='customer'">{{cellValue(row[key])}}</div>
<mh-box-score
*ngIf="key!='customer'"
[value]="cellValue(row[key])"
[type]="cellValue(row[key],'type')+' small'"
[type_number]="'percent'"
[previous_value]="cellValue(row[key],'diff')"
[previous]="cellValue(row[key],'previousLabel')"
></mh-box-score>
</div>
</mat-cell>
</ng-container>
</ng-container>
</mat-table>
он работает идеально. Теперь я хочу изменить позицию стрелки сортировки в заголовке от следующего до предыдущего в соответствии с документацией
Я искал все пути, но я не могу сделать то, что кажется таким простым.
Пожалуйста, помогите, я относительно новичок в угловых
спросил(а)
2018-01-02T22:30:00+03:00
3 года, 1 месяц назад
добавить комментарий
пожаловаться
Решение
85
Для того, чтобы переместить стрелку необходимо применить @Input()
директива пункт arrowPosition
к элементу DOM с mat-sort-header
: <th mat-sort-header="name" arrowPosition='before'>Dessert (100g)</th>
.
Вот пример stackblitz того, как применять arrowPosition
для различных заголовков таблиц, раздвоенных непосредственно из примера Material.
ответил(а)
2018-01-02T22:41:00+03:00
3 года, 1 месяц назад
добавить комментарий
пожаловаться
Ваш ответ
- Вопросы
- Angular-material2
- Угловой материал, как установить mat-sort-header из mat-table