โซลูชัน Angular i18n
รองรับคอมโพเนนต์แบบ Standalone, Signals และ SSR สำหรับแอป Angular
Get started in 3 steps
Install
Add the Better I18N Angular package to your project.
npm install @better-i18n/angular
Import the module
Import BetterI18nModule in your AppModule or standalone component.
import { BetterI18nModule } from '@better-i18n/angular';
@NgModule({
imports: [
BetterI18nModule.forRoot({
projectId: 'your-org/your-project',
defaultLocale: 'en',
}),
],
})
export class AppModule {}Use the translate pipe
Use the translate pipe or directive in your templates to display translations.
<h1>{{ 'welcome' | translate }}</h1>
<p>{{ 'greeting' | translate: { name: userName } }}</p>ฟีเจอร์
เริ่มต้นอย่างรวดเร็ว
เพิ่ม i18n ให้แอป Angular ของคุณด้วย pipe และ service
// app.component.ts
import { Component } from '@angular/core';
import { TranslateService } from '@better-i18n/angular';
@Component({
selector: 'app-root',
template: `
<h1>{{ 'welcome' | translate }}</h1>
<p>{{ 'greeting' | translate: { name: 'World' } }}</p>
`
})
export class AppComponent {
constructor(private translate: TranslateService) {
translate.setDefaultLang('en');
}
}ใช้งานร่วมกับไลบรารี i18n ยอดนิยมของ Angular
Better I18N เสริมไลบรารี i18n ของ Angular — จัดการการแปลแบบภาพ ทำงานร่วมกับนักแปล และปรับใช้ผ่าน CDN
Better I18N + @ngx-translate/core
ไลบรารีการแปลสำหรับ Angular ที่ใช้กันมากที่สุด การแปล runtime ด้วย pipes, directives และ service injection
Better I18N ส่งออกในรูปแบบ JSON ของ ngx-translate แก้ไขการแปลในแดชบอร์ด ซิงค์กับ repo ของคุณโดยอัตโนมัติ
Better I18N + Angular i18n (built-in)
ระบบ i18n อย่างเป็นทางการของ Angular พร้อม AOT compilation, ICU expressions และการแยกการแปลขณะ build
ส่งออกในรูปแบบ Angular XLIFF Better I18N จัดการเวิร์กโฟลว์การแปล Angular CLI สร้าง bundle เฉพาะ locale
Better I18N + Transloco
ไลบรารี i18n ที่ทันสมัยและน้ำหนักเบาสำหรับ Angular พร้อม lazy loading, ปลั๊กอินหลากหลาย และรองรับ TypeScript ได้ดี
ซิงค์การแปลเป็นรูปแบบ JSON ของ Transloco ผ่าน GitHub integration ของ Better I18N อัปเดตแบบเรียลไทม์ด้วย CDN delivery