WedX - журнал о программировании и компьютерных науках

Опция автоматической ширины мата в угловом материале

Как сделать так, чтобы mat-option автоматически выбирал ширину самого длинного элемента в списке.

<div class="col-md-3">
  <mat-form-field class="sm-width" appearance="outline">
    <mat-label>Дом</mat-label>
    <input (input)="InputBuilding($event)" matInput placeholder="№ дома" formControlName="buildingNumber" required maxlength="5" [matAutocomplete]="autoBuilding">
    <mat-autocomplete panelClass="mat-auto" #autoBuilding="matAutocomplete">
      <mat-option (onSelectionChange)="selectionChange(build)" *ngFor="let build of builds?.result" [value]="build.name">
        <span>{{build.typeShort}}. {{build.name}}</span>
      </mat-option>
    </mat-autocomplete>
  </mat-form-field>
  <mat-form-field class="sm-width" appearance="outline">
    <mat-label>Корпус</mat-label>
    <input matInput placeholder="Корпус" formControlName="structure" maxlength="3">
  </mat-form-field>
  <mat-form-field class="sm-width" appearance="outline">
    <mat-label>Квартира</mat-label>
    <input matInput placeholder="Квартира / Офис" formControlName="flat" maxlength="4" numbersOnly>
  </mat-form-field>
</div> 

Фото


Ответы:


1

Пытаться

::ng-deep mat-autocomplete {
    width: fit-content !important;
}
20.06.2019

2

ты можешь попробовать вот так

.auto-width{
        .mat-form-field {
            width: auto !important;
        }
        .mat-select-value {
            max-width: 100%;
            width: auto;
        }  
    }
21.06.2019
Новые материалы

Я хотел выучить язык программирования MVC4, но не мог выучить его раньше, потому что это выглядит сложно…
Просто начните и учитесь самостоятельно Я хотел выучить язык программирования MVC4, но не мог выучить его раньше, потому что он кажется мне сложным, и я бросил его. Это в основном инструмент..

Лицензии с открытым исходным кодом: руководство для разработчиков и создателей
В динамичном мире разработки программного обеспечения открытый исходный код стал мощной парадигмой, способствующей сотрудничеству, инновациям и прогрессу, движимому сообществом. В основе..

Объяснение документов 02: BERT
BERT представил двухступенчатую структуру обучения: предварительное обучение и тонкая настройка. Во время предварительного обучения модель обучается на неразмеченных данных с помощью..

Как проанализировать работу вашего классификатора?
Не всегда просто знать, какие показатели использовать С развитием глубокого обучения все больше и больше людей учатся обучать свой первый классификатор. Но как только вы закончите..

Работа с цепями Маркова, часть 4 (Машинное обучение)
Нелинейные цепи Маркова с агрегатором и их приложения (arXiv) Автор : Бар Лайт Аннотация: Изучаются свойства подкласса случайных процессов, называемых дискретными нелинейными цепями Маркова..

Crazy Laravel Livewire упростил мне создание электронной коммерции (панель администратора и API) [Часть 3]
Как вы сегодня, ребята? В этой части мы создадим CRUD для данных о продукте. Думаю, в этой части я не буду слишком много делиться теорией, но чаще буду делиться своим кодом. Потому что..

Использование машинного обучения и Python для классификации 1000 сезонов новичков MLB Hitter
Чему может научиться машина, глядя на сезоны новичков 1000 игроков MLB? Это то, что исследует это приложение. В этом процессе мы будем использовать неконтролируемое обучение, чтобы..


Для любых предложений по сайту: [email protected]