Question

我想知道是否有可能在不使用第一个组件的模板的情况下将一个组件中的变量值使用到另一个组件中，只需要变量的值就可以了。变量，当我导入它时，值不变。有可能吗？

我尝试使用this.fotoTobillo.imageTobillo并使用get方法导入变量，但结果却相同

FotoTobilloPage.ts

export class FotoTobilloPage implements OnInit {

imageTobillo: string;

constructor(private camera: Camera) {
 }

ngOnInit() {

}

public getimageTobillo() {
  return this.imageTobillo;
}
public onClick() {
  this.imageTobillo = 'NewValue';
}
}

FormularioPage.ts

export class FormularioPage implements OnInit {

imagenPie: string;
imagenTobillo: string;

constructor( private fotoTobillo: FotoTobilloPage ) {
  this.imagenTobillo = this.fotoTobillo.getimageTobillo;
  console.log(this.imagenTobillo);
}
ngOnInit() {
  console.log(this.imagenTobillo);
}
}

我希望我可以更改FotoTobilloPage.imageTobillo的值，并且可以在FormularioPage中获取该值

Answer 1

如果您想通过将component注入到constructor中来访问该方法，则只需提供服务即可。

import {Injectable} from '@angular/core';

@Injectable()
export class FotoTobilloService {

    imageTobillo: string;

    constructor(private camera: Camera) {
    }

    getimageTobillo() {
        return this.imageTobillo;
    }
    public onClick() {
        this.imageTobillo = 'NewValue';
    }
}

将以上代码保存在.ts文件中。将其添加到provider中的app.module.ts数组中。

然后import component中的班级来使用它...

export class FormularioPage implements OnInit {

    imagenPie: string;
    imagenTobillo: string;

    constructor( private fotoTobillo: FotoTobilloService ) {
        this.imagenTobillo = this.fotoTobillo.getimageTobillo();
        console.log(this.imagenTobillo);
    }
    ngOnInit() {
        console.log(this.imagenTobillo);
    }
}

如何在Angular7中的另一个组件中使用变量

1 个答案: