Question

数据传输问题（从一个组件到另一个组件） enter image description here 有两个组件DetectparamComponent DetectorComponent 在DetectorComponent中，我要写入数据，并且需要将此变量的值传递给DetectparamComponent（实际上，我将数据从表中拉出并在其他组件中使用）

我只是不知道如何进行转移（由于缺乏经验）我以为首先通过服务（сomp1-> serv-> comp2）无法正常工作据我了解，如果您使用@input，则所有html都将被拖动，但是我只需要ts文件中的1个值

https://stackblitz.com/edit/angular-klu4xt?file=src%2Fapp%2Fhello.component.ts

Answer 1

尝试

在第一个组件的HTML中

<a (click)="onSelect(data)">Go to </a>

在FirstComponent中

import { Router } from '@angular/router';

export class FirstComponent implements OnInit {
   constructor(private router: Router) {
   }
   onSelect(data) {
      this.router.config.find(r => r.component == SecondComponent).data = data;
      this.router.navigate(["Second Component routing path"]);
   }
}

第二部分

import { ActivatedRoute } from '@angular/router';

export class SecondComponent implements OnInit {
   SentItem : any;
   constructor(private router: ActivatedRoute) { }
   ngOnInit() {
      this.router.data.subscribe(r=>this.SentItem =r);
  }
}

Answer 2

在servicename.ts文件中，可以将“主题”类型属性创建为私有，然后创建另一个属性并使它可观察。这是一个例子

servicename.ts

export class servicename { 
    private propertytosend = new Subject<any>();
    propertytosend$ = this.propertytosend.asObservable();
    private data = 'Hello';
    // Method to call from outside the component through service
    // like in any component that is on the same page as the component we are getting
    // data in
    public getData() { 
       this.propertytosend.next(this.data);
    }
}

要在其中获取数据的组件中，必须使用servicename对象在构造函数中编写以下代码。

this.servicename.propertytosend$.subscribe(data => {
    this.data = data;
})

希望这会有所帮助

需要Angular 4+（数据传输到另一个组件）

2 个答案: