Клиентский чат-виджет для ионного приложения

Question

У меня есть простое приложение с ионными вкладками с тремя вкладками. Структура которого выглядит следующим образом:

>TabsPage
  >HomePage
  >AboutPage
  >ContactPage

Я хочу, чтобы у меня была функция чата, для которой я сейчас пытаюсь использовать PureChat.

Чтобы использовать PureChat в моем приложении, я должен скопировать и вставить небольшой скрипт в свое приложение, и в настоящее время я вставляю скрипт PureChat в мой index.html.

1. Наличие сценария в index.html приводит к тому, что кнопка PureChat Hello появляется на всех страницах моего приложения, но я хочу, чтобы эта кнопка отображалась только на моей странице ContactPage.

Пожалуйста, предложите, как сделать так, чтобы эта кнопка появлялась только на моей странице контактов.

Answer 1

У меня это работает над моим приложением ionic 3 - мое немного отличается.

У меня есть ссылка в меню, чтобы открыть окно живого чата - однако ваша проблема очень похожа... Я не хотел использовать стандартную кнопку purechat, мне нужна была ссылка на ссылку меню. Я добавил виджет с "пользовательской кнопкой", выбранной в PureChat.

Затем заставить его работать, я добавил код для вставки в

В моем меню я добавил:

<a (click)="openLiveChat()" menuClose class="menulink">Open Live Chat</a>

Затем в моем app.component.ts я добавил эту функцию:

openLiveChat(){
    console.log("OpenLiveChat has been clicked");
    let element: HTMLElement = document.getElementsByClassName('purechat-collapsed-image')[0] as HTMLElement;
    element.click();
 }

Технически, чат находится на каждой странице, но он скрыт до вызова функции openLiveChat().

Answer 2

Вставьте скрипт на страницу контактов

export class ContactPage{
  addScript: boolean = false;

  ngAfterViewChecked(): void {
    if (!this.addScript) {
      this.addPureChatScript();
    }
  }

  addPureChatScript() {
    this.addScript = true;
    return new Promise((resolve, reject) => {
      let scripttagElement = document.createElement('script');
      scripttagElement.src = 'location/or/url/of/script';
      scripttagElement.onload = resolve;
      document.body.appendChild(scripttagElement);
    })
  }
}