I have a number of HTML pages that are being stored locally and to be
loaded as needed into the Angular app. These page are basic HTML,
non-component, instructional/eLearning type content, that are not
necessarily dynamically driven. These aren't component html pages as there
could be anywhere from 5 to 60 pages and it seems like this would be
extremely inefficient to create 60 separate components just to be able to
load an html page and then communicate with the app. The app would be
re-usable and the number of html pages will change on each use. These page
names/urls are stored in an array in the Angular app.
My intention was to load these pages, by using
HttpClient.get(url,{responseType:text}) and have the returned data bound to
the [innerHTML] propery of a div. This seems to work as expected with one
caveat. Any JavaScript on the page does not seem to be getting executed. I
am using a custom pipe to sanitize the HTML via bypassSecurityTrustHtml. A
few questions to ask regarding my loading method and JavaScript issue as I
am relatively new to Angular:
1. Is there a better way for me to load these HTML pages than using the
[innerHTML] property? It seems like using a router / router-outlet would be
a better choice and would solve the JavaScript issue as I would be able to
directly communicate with the Angular app, but I couldn't find a way to
achieve this as I am using an array of page urls to load.
2. If I can't use a router/router-outlet, to load the pages via [
innerHTML], how can I have these loaded pages communicate to
Services/Components in my Angular app?
Any insight is certainly appreciated.
Thanks, in advance.
--
You received this message because you are subscribed to the Google Groups
"Angular and AngularJS discussion" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to angular+unsubscr...@googlegroups.com.
To post to this group, send email to angular@googlegroups.com.
Visit this group at https://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.
