Allowing scripts inside html templates in Angular 4

Question

I've noticed that scripts written in html templates are ignored in Angular (still learning it), but I want to run them sometimes despite the potential risks as stated by Angular. How could I do this?

Example:

@Component({
    templateUrl: '/html/pagex.html'
})

pagex.html:
<script>
    $(function(){alert("hi")})
</script>

Considering that some of my tags would generate JS code on runtime dynamically, modifying the script tag is not an option here.

And I assume it's not possible for you to simply execute the code within your component.ts file? — user184994, Dec 06 '17 at 20:29
@user184994: exactly, since I have purchased my UI components and I can't modify any part of it. — Arnold Zahrneinder, Dec 06 '17 at 20:30
Extend the component and then add the function in the child component? — Drew Rochon, Dec 06 '17 at 20:46
@DrewRochon: I need to handle it only and only in the html file, without adding any function to the component. In other words, I want Angular to STOP removing the script tag. — Arnold Zahrneinder, Dec 06 '17 at 20:48
Maybe I'm misunderstanding exactly what you can and cannot change? You can't add to the source? If not how are you changing the html templates? — Drew Rochon, Dec 06 '17 at 20:56
@DrewRochon: I have purchased a UI component that needs to generate scripts on run time and add them to my code. Angular is removing the generated scripts on the other hand, do you follow me? — Arnold Zahrneinder, Dec 06 '17 at 21:00
can you show your full template code with purchased ui item? I bet there is another way to solve your problem. — omeralper, Dec 06 '17 at 21:25
@omeralper: No, I have a minified JS file, and not interested in turning it into TS as I have bought it. — Arnold Zahrneinder, Dec 06 '17 at 21:33
try this: assign a template variable to the purchased angular component. say it is #myComponent and add property like: @ViewChild('myComponent') theComponent; Then you can manage the component at "ngAfterViewInit" lifecycle hook. — omeralper, Dec 06 '17 at 21:44
@omeralper: no, as I said I just wanna find a way to STOP Angular from deleting the script tag. — Arnold Zahrneinder, Dec 06 '17 at 21:57
@omeralper: I just used it but it did not do anything, the script tag is still removed — Arnold Zahrneinder, Dec 06 '17 at 22:05

Allowing scripts inside html templates in Angular 4

0 Answers0