ng2-translate - строки перевода, не обновляемые в компонентах с обнаружением изменений OnPush

Question

Когда я впервые меняю язык своего приложения, служба перевода делает запрос на файл, представляющий новый язык, мои строки «умные» компоненты отражают обновление правильно, но никаких «чистых/немых» компонентов нет, они остаются на предыдущем языке. Однако, как только новый языковой файл был загружен в кеш, и я продолжаю менять языки, все работает нормально.

Кажется, что любой чистый компонент не разрешает обновления от ответа ajax для нового языкового файла, он правильно изменит язык, если файл уже загружен в кеш. Опять же, это только для компонентов, которые используют ChangeDetectionStrategy.OnPush

Я понимаю, что changeDetection использует Входы и Наблюдения в немых компонентах, но я не так хорошо знаком, когда речь идет о трубах в этом случае. Возможно, я что-то упустил?

UDPATE

мне удалось взломать исправить, это не хорошо, но это работает. Это конструктор в моей службе, который обертывает службу Translate.

Я проверяю, есть ли у меня язык json-файла уже в кеше для языка, который я собираюсь выбрать. Если у меня его нет, я использую метод reloadLang в ng2-translate, чтобы пойти и получить его. После этого я использую пустой тайм-аут, а затем вызываю «translate.use». Там есть проблема синхронизации, потому что, если я выберу таймаут, это не сработает. Если у меня уже есть файл перевода, который я собираюсь переключить, я просто использую translate.use как обычно, и все работает нормально.

constructor(private translate: TranslateService, public store: Store<any>) { 
// this language will be used as a fallback when a translation isn't found in the current language 
translate.setDefaultLang('en'); 
// subscribe to changes 
store.select('i18n').subscribe((state: MultilingualStateI) => { 
    // update ng2-translate which will cause translations to occur wherever the TranslatePipe is used in the view 
    if (this.translate.getLangs() && (this.translate.getLangs().indexOf(state.lang) > -1)) { 
    this.translate.use(state.lang) 
    } else { 
    this.translate.reloadLang(state.lang).take(1).subscribe(() => { 
     setTimeout(() => this.translate.use(state.lang), 0); 
    }); 
    } 
}); 

}

Я не совсем уверен, что здесь происходит, но это, кажется, смесь между использованием ChangeDetectionStrategy.OnPush и свежий ответ от запроса файла перевода. Если кто-либо еще увидит это, добавьте свой ввод.

Answer 1

Я застрял в этой проблеме. У меня есть несколько графиков (я использую ng2-charts), и когда я сменил язык (например, от en до es), все ярлыки обновляются, кроме связанных с диаграммой. Для того, чтобы мои диаграммы обновились с новым языком, мне пришлось снова изменить laguage на es (так что дважды щелкните, чтобы сменить язык в первый раз).

Прочитав вашу проблему и обходной путь, я проверил ее, и проблема, как вы указали, в кеше. В первый раз, когда вы меняете язык, JSON загружается, но поскольку он не был в кеше, все компоненты не переведены (в моем случае графики не были должным образом обновлены). Во второй раз, когда вы переходите на один и тот же язык, метки уже находятся в кеше, поэтому он работает правильно.

Я установил его, загрузив все доступные языки, когда я инициализацию обслуживания:

constructor(private translate: TranslateService) { 
    var navigatorLanguage = (window.navigator.userLanguage || window.navigator.language).toLowerCase().split("-")[0]; 
    // this language will be used as a fallback when a translation isn't found in the current language 
    translate.setDefaultLang(navigatorLanguage); 
    // the lang to use, if the lang isn't available, it will use the current loader to get them 
    translate.use(navigatorLanguage) 
    // Hack to load all languages 
    // If we don't do this, the first time we change language not all elements are properly translated 
    translate.reloadLang('en') 
    translate.reloadLang('es') 
} 

В моем случае, у меня есть только эти два языка. Если их больше, может быть, некоторые из циклов будут полезны для перезагрузки каждого lang :)