如何从子组件访问 Angular 4 中的另一个子组件

Question

我有一个父组件，里面有两个不同的子组件。当我在第一个子组件中单击 link 时，我需要从第一个子组件调用第二个子组件的功能。

所以这里有一个基本图来更好地解释：

Answer 1

您可以通过 ViewChild 和 Output

来实现

例如：

@Component({
  template: '
     <child-one (clicked)="handleClick()"></child-one>
     <child-two></child-two>
  '
})
export class ParentComponent {
   @ViewChild(ChildOneComponent)
   childOne: ChildOneComponent;

   handleClick(){
    this.childOne.doSomething();
   }
}

在这种情况下：

clicked 是 ChildOneComponent

Ouput

doSomething 是一个 public 方法

另一种方法仅使用 Output 和模板变量

@Component({
      template: '
         <child-one (clicked)="childTwo.doSomething()"></child-one>
         <child-two #childTwo></child-two>
      '
    })
    export class ParentComponent {

    }

如何从子组件访问 Angular 4 中的另一个子组件

How can I access from a child component to another child component in Angular 4

angular-components

angular