Угловая динамическая локализация и facebook.sdk не обновляет перевод для кнопки Like - PullRequest
Новая
       49

Угловая динамическая локализация и facebook.sdk не обновляет перевод для кнопки Like

0 голосов
/ 21 сентября 2019

Я добавил Facebook js-sdk как директиву в угловое приложение, у меня есть кнопка, чтобы переключить язык страниц, моя проблема в том, что sdk не обновляет текст для кнопки Like, даже после того, как я удалил sdkи добавьте новый для выбранного языка.Я запустил FB.XFBML.parse () для обновления текста, но он будет продолжать использовать первый выбранный язык только после того, как обновление страницы изменится

ОБНОВЛЕННЫЙ КОД Теперь при использовании службы с ngrx при смене языка заменит SDK Facebook для этого языка и отправляет событие для любых директив страницы, чтобы удалить все теги / классы, добавленные Facebook в элементе кнопки like.и очистить своих детей.Все работает, кнопка отображается, но все еще на первом выбранном языке, она не меняет язык

Служба кодов 

@Injectable()
export class FacebookService {
  constructor(private window: any, private document, private store: Store<fromRoot.State>) {
    store.pipe(select(fromCore.getSelectedLang)).subscribe(lang => this.switchScript(lang));
    if (!this.window.fbAsyncInit) {
      this.window.fbAsyncInit = () => {
        this.window.FB.init({
          appId: environment.appId,
          autoLogAppEvents: true,
          cookie: true,
          xfbml: true,
          version: 'v4.0',
        });
      };
    }
  }

  switchScript(lang: string) {
    const langUrl = lang === 'ar' ? 'ar_AR' : 'en_US';
    const newScript = document.createElement('script');
    newScript.id = 'facebook-sdk';
    newScript.async = true;
    newScript.src = `https://connect.facebook.net/${langUrl}/sdk.js`;

    const scriptTag = this.document.getElementById('facebook-sdk');
    if (scriptTag) {
      scriptTag.parentNode.replaceChild(newScript, scriptTag);
    } else {
      this.document.body.appendChild(newScript);
    }
    this.store.dispatch(SocialAction.UpdateTags({lang}));
  }    
}

Директива кодов 

@Directive({selector: '[lyxFacebook]'})
export class FacebookDirective implements AfterViewInit, OnDestroy {
  tag$: Subscription;
  constructor(private window: any,private document, private store: Store<fromRoot.State>) {
    this.tag$ = store.pipe(select(Core.getTagLang)).subscribe(lang=> this.update(lang));
  }

  ngAfterViewInit(): void {
    if (this.window.FB) {
      this.window.FB.XFBML.parse();
    }
  }

  update(lang: string) {
    if (this.window.FB && lang) {
      const tags = this.document.getElementsByClassName('fb-like');
      if (tags && tags.length) {
        for (let i = 0; i < tags.length; i++) {
          tags[i].removeAttribute('fb-xfbml-state');
          tags[i].removeAttribute('fb-iframe-plugin-query');
          tags[i].classList.remove('fb_iframe_widget');
          tags[i].innerHTML = '';
        }
        this.window.FB.XFBML.parse();
      }
    }
  }

  ngOnDestroy(): void {
    if (this.tag$) {
      this.tag$.unsubscribe();
    }
  }
}
...