Emit Event / Подписаться на метод TypeScript (обычный файл TypeScript) в контроллере AngularJs TypeScript

Question

Как я могу подписаться / или прослушать event/method в обычном TypeScript файле, который является частью нашего AngularJs TypeScript проекта?

Context : у нас есть загрузчик, progressBar.ts с method, updateGlobalProgressBar, который выставляется через export attribute, который отслеживает загруженный процент.С другой стороны, у меня есть controller, ribbonController, который устанавливает properties ленты view.

Есть ли способ подписаться или прослушать updateGlobalProgressBar method в моем ribbonController, чтобы узнать, когда загрузчик достиг 100%?

Обратите внимание: progressBar.ts - это не AngularJs service или controller, а обычный TypeScript файл, ничто не является injected, нет constructor method и т. Д.

Я пробовал do while loop, но это создало бесконечное loop:

do {
    this._scope.loaderHasLoaded = utilities.loadingComplete();
}
while (this._scope.loaderHasLoaded === false);

Я попробовал if loop, но это сработало только один раз, и, очевидно, не в нужное время:

if (utilities.loadingComplete()) {
    this._scope.loaderHasLoaded = true;
} else {
    this._scope.loaderHasLoaded = false;
}

Мне нужно как-то прослушать variable или что-то в progressBar.ts, чтобы сообщить мне, когда загрузка будет завершена.Я написал следующий помощник method, который вызывается после завершения загрузки из updateGlobalProgressBar:

export function loadingComplete(): boolean {
    if (this.loadComplete === true) {
        return true
    } else {
        return false;
    }
}

Я могу назвать это method и т. Д., Но не знаю, как subscribe к этому?

Любая помощь будет принята с благодарностью!

Answer 1

Я постараюсь помочь вам.

Подход:

1. создайте генераторы событий в progressBar.ts, которые генерируют события, когда индикатор выполнения достигает 100% статуса.
2. выставить событие через атрибут экспорта.
3. подписаться / прослушать событие и выполнить необходимые действия.
4. Триггерное событие
5. очистить

Теперь я уточню код:

1. создать источники событий в progressBar.ts, которые генерируют события, когда индикатор выполнения достигает 100% статуса.

   Базовое событиесоздание класса эмиттера и экземпляра:

   class EventEmitter {

           listeners=[];
   
           register(callback) {
   
               var _listeners = this.listeners
   
               _listeners.push(callback);
   
               return function() {
                   _listeners.splice(_listeners.indexOf(callback), 1);
               }
   
           }
   
           trigger() {
               var args =arguments;
               this.listeners.forEach(callback => callback.apply(null, args));
           }
       }
   
   
       const onProgressBarComplete = new EventEmitter();
   

2. предоставляет событие через атрибут экспорта

export onProgressBarComplete;

подписаться / прослушать событие и выполнить необходимые действия.

import {onProgressBarComplete} from './progressBar';

var unListenToEvent = onProgressBarComplete.register(function() {
    // code in response to event
});

trigger Event: В методе updateGlobalProgressBar добавить условие

if(progress === 100) { //This condition is up to you
    onProgressBarComplete.trigger();
}

очистить.

, если вы больше не заинтересованы в событии, удалите подподписку, выполнив:

unListenToEvent ();

Надеюсь, что это указывает вам в правильном направлении.Ура!