Question

我有一个变量testgetinfos，它存储从服务返回的对象数组，我想在另一个组件中使用此变量，

下面是我从服务存储对象数组的函数，在这里，当我在该函数中打印testgetinfos变量的输出时，它的输出符合预期

samplefunc(var1,var2) {
this.testgetInfoService.retrieveAllinfos(this.var1,this.var2).subscribe(
  response => {
    this.testgetinfos= response;
    this.router.navigate(['sample']) 
    console.log(this.testgetinfos)
  }

)
}

该功能是以下组件的一部分。

import { Component, OnInit } from '@angular/core';
import { TestgetInfoService } from '../service/data/test-info.service';
import { Router } from '@angular/router';

export class testinfo {
constructor(
public id: number, 
  public testvar1: string,
  public testvar2: string,
  public testvar3: string

 ){
 }
}
@Component({
 selector: 'app-test-info',
 templateUrl: './test-info.component.html',
 styleUrls: ['./test-info.component.css']
})
export class testInfoComponent implements OnInit {
var1=''
var2=''
public test : string [] 
public testinfos : testinfo[]
constructor(
private testInfoService:TestgetInfoService,
private router:Router
) { }

ngOnInit() {

}
samplefunc(var1,var2) {
this.testgetInfoService.retrieveAllinfos(this.var1,this.var2).subscribe(
  response => {
    this.testgetinfos= response;
    this.router.navigate(['sample']) 
    console.log(this.testgetinfos)
  }

)
} 

}

下面是“样本”组件中的脚本，在该脚本中，我尝试打印testgetinfos变量的输出，

import { Component, OnInit } from '@angular/core';
import { Testinfo } from '../test-info/test-info.component';

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

constructor() { }
};

ngOnInit() {
this.displayinfo();
}
displayinfo(){
console.log("Gather info")
console.log(this.testinfos)
}
}

Answer 1

例如，您必须在要使用服务的组件的构造函数中声明服务。您有一个名为TestService的服务。您想在TestComponent中使用此服务。为此，您必须在TestComponent中使用依赖注入，以执行以下操作：

export class TestComponent implements OnInit {
 constructor(private testService: TestService) {}

 ngOnInit() {
  this.testService.testMethod();
 }
}

在Angular 7中将变量从一个组件中的服务访问到另一个组件

1 个答案: