how to register plain js function to @Output in angular
Question
I have a function in the script tag in index.html hideAppLoader() and there is an angular app component in index.html. I want to call that function when the application got bootstrapped. I have tried with @Output but this is not working. Here is the code
index.html
<head>
<script>
function hideAppLoader() { debugger;}
</script>
</head>
<body>
<my-app (onAppLoad)="hideAppLoader($event)"></my-app>
</body>
and in the ts file
@Output() onAppLoad = new EventEmitter();
ngOnInit() {
this.onAppLoad.emit();
}
but the function is not getting called even there is no error on the console. I have even tried (onAppLoad)="this.hideAppLoader($event)" and (onAppLoad)="window.hideAppLoader($event)"
What is the solution or is even possible to call plain js function from angular component when it is loaded?
1 answers
solution1
2 2018-05-03 12:24:55
Since the script function is global you do not need to use and EventEmitter. just change your ngOnInit to be:
ngOnInit() {
window.hideAppLoader();
}
Judging by the name of hideAppLoader you could define the loader inside of the my-app tag and Angular will remove it once the AppComponent is Loaded.
<my-app>
<img src="assets/loader" />
</my-app>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.