Angular报错：无法绑定'dep'属性至app-add-edit-dep组件

针对你遇到的Can't bind to 'dep' since it isn't a known property of 'app-add-edit-dep'错误，按照以下步骤排查解决：

1. 确保app-add-edit-dep组件定义了dep输入属性 #

打开app-add-edit-dep对应的TS文件，添加@Input()装饰器声明dep属性，允许父组件通过属性绑定传递数据：

import { Component, Input, OnInit } from '@angular/core';

@Component({
  selector: 'app-add-edit-dep',
  templateUrl: './add-edit-dep.component.html',
  styleUrls: ['./add-edit-dep.component.css']
})
export class AddEditDepComponent implements OnInit {
  // 添加@Input()装饰器，声明可接收父组件传递的dep数据
  @Input() dep: any;

  constructor() { }

  ngOnInit(): void {
    // 可在此处使用传入的dep数据
  }
}

2. 确认app-add-edit-dep组件已在模块中声明 #

找到当前组件所在的模块文件（比如DepartmentModule或AppModule），确保AddEditDepComponent已被导入并添加到declarations数组中：

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { ShowDepComponent } from './show-dep/show-dep.component';
import { AddEditDepComponent } from './add-edit-dep/add-edit-dep.component'; // 导入组件

@NgModule({
  declarations: [
    ShowDepComponent,
    AddEditDepComponent // 将组件添加到模块声明列表
  ],
  imports: [
    CommonModule
  ]
})
export class DepartmentModule { }

3. 检查属性名大小写一致性 #

确保模板中绑定的[dep]与子组件中@Input() dep的变量名完全一致（Angular对属性名大小写敏感）。

注意：官方提示中的CUSTOM_ELEMENTS_SCHEMA或NO_ERRORS_SCHEMA仅适用于非Angular组件场景，不建议用于解决Angular组件的属性绑定问题，会屏蔽真实的代码错误。

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