Angular 跨组件使用静态变量

我有一个数据存储TypeScript文件，它有几个字符串数组：

export const servicesData =
    [
        'test',
        'test',
    ];

export const surgeonsData =
    [
        'test',
        'test',
    ];

然后我有另一个组件，我一次实例化了多个组件。我希望以静态方式使用数据存储阵列，这样我就可以在所有实例中使用它们，而无需每次读取

import { surgeonsData, servicesData } from 'app/data-models.ts'

@Component({
    selector: 'booking',
    template:
        `
          <div *ngFor="let s of surgeons">
            {{s}}
          </div>
        `
})


export default class BookingComponent {

    surgeons = surgeonsData;
    services = servicesData;

    constructor() {}


}

这是我现在所拥有的东西的快速摘要。每个预订组件都需要使用data-model.ts文件中的数组，而无需每次重新读取

import { surgeonsData, servicesData } from 'app/data-models.ts'

@Component({
    selector: 'booking',
    template:
        `
          <div *ngFor="let s of surgeons">
            {{s}}
          </div>
        `
})


export default class BookingComponent {

    surgeons = surgeonsData;
    services = servicesData;

    constructor() {}


}

从'app/data models.ts'导入{surgeonsData，servicesData}
@组成部分({
选择器：“预订”，
模板：
`
{{s}
`
})
导出默认类BookingComponent{
外科医生=手术数据；
服务=服务数据；
构造函数（）{}
}

---

因此，在我上面的示例中，每次创建新组件时，surgeonData都会保存到外科医生变量中。我不希望每次都这样做，而是希望每个组件只能访问一个变量。

使用服务访问全局可用的静态变量。尝试在服务之外执行此操作会遇到分区和更改检测的问题。

为什么有必要这样做？我的想法是，在所有组件实例中将其作为静态变量随时可用，这比注入服务并每次调用它要快。@ScottMackenzie这不是性能问题，更重要的是简单性问题。根据定义，服务是单例的，并且只会实例化一次。也许你的问题是，如果你能对一个变量有一个全局引用，但Angular编译时实际上就是这种情况。在这种情况下，性能非常重要，因为一次可能有50个左右的组件。你的问题是什么？我不想每次都这样做，而是希望每个组件只能访问一个变量。为什么？@torazaburo有许多组件，而真正的阵列相当大，这导致它运行非常缓慢。由于数据永远不会更改，因此实际上不需要在每次实例化时保存变量，因此只有一个可全局使用的副本是有意义的。请参见下面的回答您没有“保存变量”，当然也没有复制数组。您只需创建一个从组件属性到全局值的引用。性能影响可以忽略不计。无论您可能遇到什么性能问题，它们都不太可能与在组件属性中保留指向全局值的指针有关。