我正在使用角材质matInput matFormfield和matselect，但它没有在屏幕上显示

Question

首先，我手动添加垫子组件，一开始它可以工作，但后来我使用 bard 根据我给出的模式编写其余的代码，然后我开始复制并粘贴内容和所有突然它停止正确加载组件，甚至是我手动完成的组件。

这是我的html：

<div class="card">
                        <div class="card-body">
                            <div class="row">
                                <div class="row">
                                    <div class="col-sm-12 m-3">
                                        <mat-form-field class="w-100">
                                            <mat-label>Nome do Projeto:</mat-label>
                                            <input matInput [(ngModel)]="projeto.nome" type="text" name="nome" required>
                                            <mat-error>O Campo é obrigatório</mat-error>
                                          </mat-form-field>
                                    </div>
                                    <div class="col-sm-12">
                                        <mat-form-field>
                                            <mat-label>Descrição</mat-label>
                                            <textarea [(ngModel)]="projeto.descricao" matInput
                                                  cdkTextareaAutosize
                                                  #autosize="cdkTextareaAutosize"
                                                  cdkAutosizeMinRows="1"
                                                  cdkAutosizeMaxRows="5" name="descricao"></textarea>
                                      </mat-form-field>
                                    </div>
                                </div>
                                <div class="col-12">
                                    <div class="row">
                                        <div class="col-6 w-100">
                                            <div class="row">
                                               
                                                
                                                <div class="col-sm-12">
                                                    <mat-form-field class="w-100">
                                                        <mat-label>Nome do Projeto:</mat-label>
                                                        <input type="text" [(ngModel)]="projeto.progresso" name="progresso"
                                                                    placeholder="Exemplo: 50%" required>
                                                        <mat-error>O Campo é obrigatório</mat-error>
                                                      </mat-form-field>
                                                </div>
                                                <div class="col-sm-12">
                                                    <mat-form-field>
                                                        <mat-label>Estado</mat-label>
                                                        <mat-select [(ngModel)]="projeto.estado" name="estado">
                                                          <mat-option value="Pedido">Pedido</mat-option>
                                                          <mat-option value="Em Progresso">Em Progresso</mat-option>
                                                          <mat-option value="Feito">Feito</mat-option>
                                                        </mat-select>
                                                      </mat-form-field>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-6 w-100">
                                            <div class="row">
                                                <div class="col-sm-12">
                                                    <mat-form-field>
                                                        <mat-label>Data de Início</mat-label>
                                                        <input matInput type="date" [(ngModel)]="projeto.data_inicio" name="data_inicio">
                                                      </mat-form-field>
                                                </div>
                                                <div class="col-sm-12">
                                                    <mat-form-field>
                                                        <mat-label>Data Fim Prevista</mat-label>
                                                        <input matInput type="date" [(ngModel)]="projeto.data_fim_prevista" name="data_fim_prevista">
                                                      </mat-form-field>
                                                      
                                                </div>
                                                <div class="col-sm-12">
                                                    <mat-form-field>
                                                        <mat-label>Tipo Projeto</mat-label>
                                                        <mat-select [(ngModel)]="projeto.tipo_projeto" name="tipo_projeto">
                                                          <mat-option value="Interno">Interno</mat-option>
                                                          <mat-option value="Externo">Externo</mat-option>
                                                        </mat-select>
                                                      </mat-form-field>
                                                      
                                                </div>
                                                <div class="col-sm-12">
                                                    <mat-form-field>
                                                        <mat-label>Cliente</mat-label>
                                                        <mat-select [(ngModel)]="projeto.id_cliente" name="id_cliente">
                                                          <mat-option [value]="5">Localhost</mat-option>
                                                          <mat-option *ngFor="let cliente of clientes" [value]="cliente.id_cliente">
                                                            {{ cliente.nome }}
                                                          </mat-option>
                                                        </mat-select>
                                                      </mat-form-field>
                                                      
                                                </div>
                                                <div class="col-sm-12">
                                                    <div class="input-group input-group-sm mb-3">
                                                        <mat-form-field class="w-100">
                                                            <mat-label>Sumário:</mat-label>
                                                            <input type="text" [(ngModel)]="projeto.sumario" name="sumario" required>
                                                            <mat-error>O Campo é obrigatório</mat-error>
                                                          </mat-form-field>
                                                    </div>
                                                </div>
                                                
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="card-footer">
                            <button class="meu-botao" [disabled]="isCreating" (click)="criarProjeto()">
                                {{ isCreating ? 'Aguarde...' : 'Gravar' }}
                            </button>
                        </div>
                    </div>

这就是页面现在的样子： 这就是它应该的样子（我从其他组件中截取了屏幕截图）：

我尝试删除代码并将其放回原处，但什么也没有，这只发生在这个组件中，在其他组件中，matinput 显示正常

Answer 1

根据你的代码，我认为你没有导入MatInputModule。

将此添加到您喜欢的位置。

import { MatInputModule } from '@angular/material/input';