Angular 11 - 在@component 声明中包含语言字典 - 如何最好地声明？

如何解决Angular 11 - 在@component 声明中包含语言字典 - 如何最好地声明？

在 angular 中，模块在导出其类之前有一个带有选项的声明。这些包括选择器、templateurl、styleURLs、moduleId，我还见过其他的。但我没有在任何地方看到所有选项的详尽列表。

我想做的是以下内容的简化版本...

我将网页上的 15 种语言翻译放在一个单独的 .ts 文件中作为 @Injectable。

@Injectable()
export class Languages {
    public dialect = {
        "Vocab": [
            //english
            {
                "about": {
                    "tag1": "This is the text that will display as English for this object.",},//Spanish
            {
                ...
            }
        ]
    }
}

然后我必须将它导入到我的 app.module.ts 中，并将其设置为那里的提供者。

import { Languages } from './languages';
  providers: [
    Languages,...
  ],

然后我必须将它导入到我组件的 .ts 中，然后我必须将它添加到构造函数中。

import { Languages } from "./app.languages";

@Component({
    selector: 'app.comp1',templateUrl: 'app.comp1.html',styleUrls: ['./app.comp1.scss']
  })
  export class Comp1 {
    constructor( public languages : Languages) {} 

然后我可以根据浏览器的语言设置在 HTML 中调用字符串作为变量。

<a>
    <!-- Object description in English -->
    {{this.languages.dialect.Vocab[this.globals.languageIndex].about.tag1}}
</a>

一切都运行得很好，但我想为每个组件添加一个特定于组件的 .ts 并仅使用 @component 声明将其拉入本地 HTML，完全绕过 app.module.ts。我想简化 - 有没有一种好的方法可以做到这一点，并且仍然保持 HTML 中功能的核心相同？我希望有这样的事情：

@Component({
    selector: 'app.comp1',styleUrls: ['./app.comp1.scss'],providers: './app.comp1.language.ts'
  })
  export class Comp1 {

这样的事情有可能吗？

谢谢。