How to call an Angular 4 method from a standalone plain JavaScript function?

Question

I\'d like to be able to pass some data\\propagate events from a plugin on the page to my Angular 4 app.

More specifically, in my case data\\events are generated insi

Answer 1

The way it should be done depends on particular case, especially on the precedence.

If Silverlight aplication is initialized before Angular application, and window.somePlainJsFunction is called before finishing Angular application initialization, this will result in race condition. Even if there was an acceptable way to get Angular provider instance externally, the instance wouldn't exist during somePlainJsFunction call.

If window.somePlainJsFunction callback is called after Angular bootstrap, window.somePlainJsFunction should be assigned inside Angular application, where SomeAngularClass provider instance is reachable:

window.somePlainJsFunction = function (data) {
    SomeAngularClass.method();
}

If window.somePlainJsFunction callback is called before Angular bootstrap, it should provide global data for Angular application to pick up:

window.somePlainJsFunction = function (data) {
    window.angularGlobalData = data;
}

Then window.angularGlobalData can be used inside Angular, either directly or as a provider.

Working Example