angular - 在 ionic 3 中更新全局变量

我对 ionic、angular 和 typescript 都是新手。我有一个变量 "ar: AR"，我需要在所有页面中使用，所以我认为将它作为全局变量是一个好主意。我是这样做的：

首先我定义：

@Injectable()
export class AR {

 public roll: FR;

 constructor() {
   this.roll = new FR("test");
 } 

 set_roll(_roll) {
    this.roll = _roll;
 }

 get_roll() {
    return this.roll;
 }

}

然后我在 app.module.ts 中将该类作为提供者添加。

import { AR } from ...
@NgModule({
  ...
 providers: [ AR, ...]
 })

在 app.components.ts 中，我定义了一个函数：

export class MyApp {
rootPage:any = HomePage;

constructor(public ar: AR) {

  platform.ready().then(() => {
    ...
  }

}

activate(roll){
    this.ar.set_roll(roll);
   }

}

在 app.html 中，我定义了一个按钮，该按钮应该将这个变量“ar”设置为存储在名为“myArray”的数组中的新值：

<ion-content>
    <ion-list>
          <ion-item *ngFor="let i of myArray (click)="activate(i)">
   </ion-list>
</ion-content>

然而，全局变量的值不会改变。它始终保持在 AR 类构造函数中定义的初始值 "test"。

它应该打印在另一页上：

import { AR } from ...;


@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {

    ar_name: string;

    constructor(..., public ar: AR) {
      this.ar_name = this.ar.get_roll().get_rollname();
    }

(get_rollname 是 AR 类的一个函数，仅返回一个字符串。)

在相应的 HTML 中：

 <ion-footer>
  <div> {{ar_name}} </div>
 </ion-footer>

我哪里做错了？

编辑：

export class FR {

    private rollname: string; 

    constructor(rollname: string) {
      this.rollname = rollname
    }

    set_rollname(newName: string) {
       this.rollname = newName;
    }

    get_rollname() {
       return this.rollname;
    }

}

答案＃1

感谢大家的帮助。我实际上是通过将所有数据数组和相应的函数放入一个提供者中来解决整个问题的。这样，所有数据和方法对所有页面都是可用的。使用提供者 - 这让一切变得更简单、更容易。

答案＃2

注入器可以异步惰性加载，因此有时可能会有多于一个可注入对象的实例，因为存在多个注入器。请参见这里和这里。

也许这适用于你。