Question

我有一些字符串常量值，必须在许多组件中使用。我不想在单个组件中硬编码或将它们写为字符串。在angular2应用程序中维护它们的最佳位置在哪里？

Answer 1

在角度上没有像angularJs 1这样的常量或配置。

所以我会说要制作一个飞机课并将所有的弦放在那里。你可以将它们设置为静态，以便直接使用类名来访问它们。

export class StngsValue {
  static finrstWord = 'this is test string';
  static secoundWord = 'this is test string';
  static thirdWord = 'this is test string';
}

或者你可以将所有字符串放在一个json文件中并从像这样的角度服务中调用该josn文件

@Injectable()
export class ConfigService {
  public config: any;
  private configObs: Observable<any>;

  constructor(private http: Http) {
   }

  public load(): Observable<any> {
    if ( this.config ) {
      return Observable.of(this.config);
    } else {
      this.configObs = this.http.get('/configuration.json').map((res) => {
        this.config = this.config || res.json() || {};
        return this.config;
      });
    }

    return this.configObs;
  }
}

Answer 2

其中一个解决方案是将您的字符串放在共享服务中。在需要该属性的每个组件中注入服务。如果你的字符串不是一个常量并且字符串值可能会更新（这不是你的情况，我猜），这是特别好的。

另一种方法是声明一个'普通'的typescript类，* .ts文件，如下所示：

export const CONFIG = Object({
    MYSTRING: 'Hello',
...
)}

然后在组件中使用它（例如）：

  import { CONFIG } from 'shared/config';

  myString = CONFIG.MYSTRING;

最好将所有常量分组到一个地方。

你也可以选择一个常数：

export const MyString = "Hello";

然后您可以像以前一样在组件中导入它。

Answer 3

您可以使用共享服务并使其成为单身，以便所有组件都能够从该服务访问数据/方法/等。所以你只需将文件声明为

shared.service.ts

内

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

@Injectable()
export class SharedService{

  public str: string;

}

在你的app.module.ts中导入服务，在@ngModule中，在提供者中添加：

providers: [ SharedService ]

然后在任何组件中只需导入服务，并在组件构造函数中添加：

constructor(public service: SharedService){}

在这里，您将服务注入您的组件，您可以阅读依赖注入

现在您可以使用this.service.string

访问您的字符串

angular2许多字符串值存储

3 个答案: