angular material组件表单校验报错问题?

作者站长头像
站长
· 阅读数 10

在做表单校验时报错 formControl 属性未找到

angular material组件表单校验报错问题?

angular material组件表单校验报错问题?

代码是复制文档里的, https://v14.material.angular.io/components/form-field/overview 不知道是什么原因报的错??

angular material组件表单校验报错问题?

模块引入代码如下

material.module.ts

import { NgModule } from '@angular/core';

import { MatButtonModule } from '@angular/material/button';
import { MatCardModule } from '@angular/material/card';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatChipsModule } from '@angular/material/chips';
import { MatDialogModule } from '@angular/material/dialog';
import { MatDividerModule } from '@angular/material/divider';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatGridListModule } from '@angular/material/grid-list';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { MatMenuModule } from '@angular/material/menu';
import { MatRadioModule } from '@angular/material/radio';
import { MatSelectModule } from '@angular/material/select';
import { MatSidenavModule } from '@angular/material/sidenav';
import { MatSliderModule } from '@angular/material/slider';
import { MatSlideToggleModule } from '@angular/material/slide-toggle';
import { MatToolbarModule } from '@angular/material/toolbar';
import { MatTooltipModule } from '@angular/material/tooltip';

@NgModule({
  exports: [
    MatRippleModule,
    MatSnackBarModule,
    MatButtonModule,
    MatCardModule,
    MatCheckboxModule,
    MatChipsModule,
    MatDialogModule,
    MatDividerModule,
    MatFormFieldModule,
    MatGridListModule,
    MatIconModule,
    MatInputModule,
    MatMenuModule,
    MatRadioModule,
    MatSelectModule,
    MatSidenavModule,
    MatSliderModule,
    MatSlideToggleModule,
    MatToolbarModule,
    MatTooltipModule
  ]
})
export class MaterialModule { }

shared.module.ts

import { NgModule } from '@angular/core';

import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { InternationalizationModule } from 'src/app/base/module/internationalization.module';
import { MaterialModule } from 'src/app/base/module/material.module';

@NgModule({
  exports: [
    CommonModule,
    FormsModule,
    InternationalizationModule,
    MaterialModule
  ]
})
export class SharedModule { }

目前引入的模块就那么多, formControl 属性还需要依赖其他模块吗?

回复
1个回答
avatar
test
2024-07-11
import { ReactiveFormsModule, FormsModule } from '@angular/forms';

formControlReactiveFormsModule 里面的指令

answer image

可以查看在线源码的模块导入

回复
likes
适合作为回答的
  • 经过验证的有效解决办法
  • 自己的经验指引,对解决问题有帮助
  • 遵循 Markdown 语法排版,代码语义正确
不该作为回答的
  • 询问内容细节或回复楼层
  • 与题目无关的内容
  • “赞”“顶”“同问”“看手册”“解决了没”等毫无意义的内容