我正在處理帶有 angular 的多語言專案，更改語言和樣式表的邏輯是在應用程式默認組件中輸入的，我創建了導航欄組件，但我無法使用 changeLanguage 功能，因為它在應用程式組件中，所以我必須復制我制作的每個組件中的功能和邏輯，如何解決這個問題或如何使應用程式組件中的功能在其他組件中可用？
應用組件代碼
import { Component } from '@angular/core';
import { TranslateService } from "@ngx-translate/core";
import { Inject } from '@angular/core';
import { DOCUMENT } from '@angular/common';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.scss']
})
export class AppComponent {
title = 'labsystem';
constructor(private translateService: TranslateService, @Inject(DOCUMENT) private document:
Document) { }
changeLanguage(lang: string) {
let htmlTag = this.document.getElementsByTagName('html')[0] as HTMLHtmlElement;
htmlTag.dir = lang === "ar" ? "rtl" : "ltr";
this.translateService.setDefaultLang(lang);
this.translateService.use(lang);
this.changeCssFile(lang);
}
changeCssFile(lang: string) {
let headTag = this.document.getElementsByTagName("head")[0] as HTMLHeadElement;
let existingLink = this.document.getElementById("langCss") as HTMLLinkElement;
let bundleName = lang === "ar" ? "arabicStyle.scss" : "englishStyle.scss";
if (existingLink) {
existingLink.href = bundleName;
} else {
let newLink = this.document.createElement('link');
newLink.rel = "stylesheet";
newLink.id = "langCss";
newLink.href = bundleName;
headTag.appendChild(newLink);
}
}
}
我需要在其他組件中使用這些函式
uj5u.com熱心網友回復：
你可以創建一個像 app.constant.ts 這樣的常量檔案，然后你就可以做到
export myFunction = () => {
// your code here
}
并且，只需在任何地方通過參考呼叫該函式。
import {myFunction} from './app.constant'
轉載請註明出處，本文鏈接：https://www.uj5u.com/houduan/362690.html
標籤：有角的
上一篇：對話框以角度顯示在頁面底部