Angular

i1n SDK या ngx-translate के साथ ब्रिज मोड का उपयोग करके Angular के साथ i1n को एकीकृत करें।

सेटअप

अपने एंगुलर प्रोजेक्ट में i1n init चलाएँ। यदि @ngx-translate/core मौजूद है, तो CLI इसका स्वतः पता लगाता है और JSON प्रारूप को कॉन्फ़िगर करता है।

अनुवाद फ़ाइलें locales/ डायरेक्टरी में संग्रहीत होती हैं, जो ngx-translate के HttpLoader के साथ संगत हैं।

स्टैंडअलोन मोड

i1n से init और t इम्पोर्ट करें और उन्हें सीधे अपने Angular सेवाओं और कंपोनेंट्स में उपयोग करें। i1n SDK, ngx-translate का एक हल्का विकल्प है।

निर्भरता इंजेक्शन के लिए एक Angular सेवा के माध्यम से t() प्रदान करें, या सीधे कंपोनेंट टेम्प्लेट में कॉल करें।

ngx-translate के साथ ब्रिज मोड

यदि आपकी परियोजना ngx-translate का उपयोग करती है, तो इसे इससे कनेक्ट करें: registerI1n((key, params) => translateService.instant(key, params))। i1n t() फ़ंक्शन ngx-translate को सौंपता है जबकि टाइप-सेफ़ ऑटो-कम्प्लीट प्रदान करता है।

i1n अनुवाद फ़ाइलों और टाइप जनरेशन का प्रबंधन करता है। ngx-translate रनटाइम लोडिंग, ट्रांसलेट पाइप और TranslateService को संभालना जारी रखता है। आपके मौजूदा टेम्प्लेट अपरिवर्तित रहते हैं।

परिनियोजन

अपनी बिल्ड स्टेप में i1n पुल जोड़ें। जेनरेट की गई अनुवाद फ़ाइलें ngx-translate के अपेक्षित प्रारूप के साथ संगत हैं।

बड़े ऐप्लिकेशन्स के लिए, नेमस्पेस फ़ाइलों का उपयोग करके फ़ीचर मॉड्यूल के अनुसार ट्रांसलेशन को व्यवस्थित करें।

src/app/app.component.ts
import { TranslateService } from '@ngx-translate/core';

@Component({
  template: '<h1>{{ "welcome" | translate }}</h1>'
})
export class AppComponent {
  constructor(private translate: TranslateService) {}
}
Bridge Mode — app.module.ts
import { registerI1n } from 'i1n'
import { TranslateService } from '@ngx-translate/core'

// In your AppComponent constructor:
registerI1n((key, params) => this.translate.instant(key, params))

संबंधित