Angular使用Material Stepper报TS1146声明预期错误怎么解决？

解决方案 #

出现该报错的核心原因及对应修复方法如下：

• 原因1：缺少@ViewChild必填配置参数
  Angular 8及以上版本中@ViewChild()装饰器要求必须传入第二个配置参数，你当前仅传入了选择器参数，属于语法缺失。
  修复代码如下：

  // 元素未被*ngIf/*ngFor等结构指令包裹、初始就渲染的场景，static设为true
  @ViewChild('stepper', { static: true }) stepper: MatHorizontalStepper;
  
  // 元素被条件渲染的场景，static设为false，实例在ngAfterViewInit钩子后可访问
  @ViewChild('stepper', { static: false }) stepper: MatHorizontalStepper;
  

• 原因2：代码位置错误
  检查@ViewChild声明是否写在组件类的属性声明区域，不能写在类的方法内部、也不能写在类定义外部。
• 原因3：前置代码存在语法问题
  检查该声明的上一行代码是否存在漏写分号、未闭合的括号/引号等语法错误，前置语法异常会导致TS编译器无法识别后续的属性声明。
• 原因4：依赖版本不兼容
  检查你安装的@angular/material版本是否和Angular 12版本匹配，版本不匹配可能导致MatHorizontalStepper类型导出异常，引发声明报错。

内容的提问来源于stack exchange，提问作者midowu