Angularjs 将值传递给同一级别的组件

我想把数组的值传递给同一级别的组件。 我的应用程序的结构是：

• 边栏组件
• 数据服务
• 身体。部件

在侧边栏组件中，我得到了一个按钮，点击后，我点击了一个API

侧栏.component.ts

export class SidebarComponent implements OnInit {
  things : Thing [] = [];

  ngOnInit(): void {
  }

  onClick(user): void {
    this.dataService.getThings(user.item.id).subscribe(
      data => {
        this.things = data.items;
      }
    )
  }
}

data.service.ts

@Injectable({
  providedIn: 'root'
})
export class DataService {

  constructor(private httpClient: HttpClient) { }

  public getThings(id): Observable<ThingsResources> {
    return this.httpClient.get<ThingsResources>(this.thingsUrl + id);
  }
}

@可注入({
providedIn:'根'
})
导出类数据服务{
构造函数（私有httpClient:httpClient）{}
公共getThings（id）：可观察{
返回this.httpClient.get（this.thingsUrl+id）；
}
}

sidebar.html

{{things.name}

在sidebar.html中显示thing值效果很好，但是我想在body中显示这个值

body.html

{{things.name}

侧边栏和主体组件不是子组件和父组件。我猜@Input和@Output将不起作用。

---

您知道如何传递这些值吗？

1-我看到这里有冲突，您用容器的相同名称声明了var

<ng-container *ngFor= "let things of things">

3-您可以通过在

数据服务

中创建一个

GetThings

函数来传递值，然后像那样调用该函数（在将其注入

正文

之后）

---

或者您可以在

侧栏中创建一个静态变量

我修复了上述两个问题。身体是我的组成部分。侧边栏也是我的组件。在这种情况下，我希望将东西从侧边栏传递到正文，以便在我的正文中使用它。htmlas我看到你已经有了服务，为什么不将此服务注入

正文

并从中获取数据呢。（在您已经在服务表单

侧栏

中设置了数据之后）或者您可以在

侧栏

中使用静态变量。我按照您通过服务所说的做了。我将我的方法移动到服务，创建了getter并在body组件中使用它。谢谢

<div>
    <div *ngFor= "let thing of things">
        <span>{{ thing.name }}</span>
    </div>
</div>

<div *ngFor= "let thing of dataServ.GetThings()">