如何在Angular中唯一地识别组件的父组件答案

【问题标题】：How to identify parent component of a component uniquely in Angular如何在Angular中唯一地识别组件的父组件
【发布时间】：2020-03-23 16:57:54
【问题描述】：

我有一个名为 Com1 的组件，我将该组件导入到多个组件中。我的 Com1 组件包含一个按钮，并在单击该按钮时触发功能。在该函数中，我想打印 Com1 组件实例的父组件。我怎样才能做到这一点。下图描述了场景。

这是我的组件。

@Component({
  selector: 'app-filter',
  templateUrl: './filter.component.html',
  styleUrls: ['./filter.component.css']
})
export class FilterComponent implements OnInit {

  constructor(

  ) { }

  ngOnInit() {

  }

  onButtonClicked() {
    console.log("parent component");
  }

}

单击按钮时，我想将 Com1 组件的父组件打印为 Com2、Com3、Com4。

【问题讨论】：

我怀疑你是否可以从孩子做，但一个很好的解决方法是，在按钮点击时向父母发出一个事件并让父母记录它是哪个组件
是的.. 但问题不只是 console.log()。有一些解决方法。它有点复杂。这就是为什么我只要求 console.log()。所以它不可能在父组件内部做。我必须在子组件本身中这样做。
那么请解释整个场景，否则帮助将很困难

标签： javascript angular components

【解决方案1】：

您可以将父组件名称作为输入传递给您的子组件并在那里使用它。

@Input parentName:string;

在html中

[parentName]="com2"

【讨论】：