在angular4中将数据从一个组件传递到另一个组件

在我的角度应用程序中有两个组件（组件1和组件2）。我在我的应用程序组件中呈现了这两个组件。 现在我想将一个值从Component1发送到Component2。如何发送。有什么最佳实践吗

在Component1中，我有这样一个代码。 Component1.html

<button (click)="passData()">Click Me</button>

在appcomponent.html中，我有这样的代码

<app-component1></app-component1>
<app-component2></app-component2>

现在我将把值从组件1发送到组件2。但在输出中有两次单击按钮

另一个问题是，我想把数据从一个组件传输到另一个组件，这个组件位于组件树的同一个hirearchy中。

---

通过以上方法，我不会将组件放在同一个组件树中。

有三种方法可以实现相同的功能

• （适用于组件具有父子关系的情况）
• （为大型项目提供更广泛的共享服务）

---

如果要将数据从父组件传递到子组件，则应使用

@input

在您的情况下，您希望将数据从一个组件传递到同一级别的另一个组件。我建议你去共享服务

---

查看此以获取更多详细信息。

请添加演示您尝试完成的任务的代码。您在google上搜索了吗？是的，我搜索了。开始@roopteja的最佳位置您使用的是事件发射器。请查看一下，很高兴看到这里有很多类似的问题，为什么你要回答同样的问题呢？他是一个新手，他需要一些帮助，他可以从那里开始@Sajeetharan我见过你回答这样的问题，哈哈，我做了，但这些天没有。如果他提供代码，这是有意义的！我明白，但如果他说得具体一些，我可以发表评论，但他不必回答。如果你想的话，我会把它拿下来。我附上了一个代码和我的问题。请看一下并回答。提前谢谢

<app-component1 (SendValue)="ValueFromComp1($event)"> </app-component1>
{{ValueFromComponent1}}

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

@Component({
  selector: 'app-component2',
  templateUrl: './component2.component.html',
  styleUrls: ['./component2.component.css']
})
export class Component2Component implements OnInit {
  ValueFromComponent1:any;
  constructor() { }

  ngOnInit() {
  }
  ValueFromComp1(var1:any)
  {
      this.ValueFromComponent1=var1;
  }

}

<app-component1></app-component1>
<app-component2></app-component2>