使用Angular2将UI添加到现有站点

Question

By adding data- attributes to the markup of an existing site I can embed the metadata required to write client-side code to add features to the existing pages, eg, bring up a detail or editor box, or show related info.

It seems straightforward enough to approach this using jQuery with KnockoutJS and Bootstrap for a responsive and good looking UI.

Could I use Angular? What I don't understand is that in all the Angular2 examples the whole site is an Angular2 SPA whereas I want to add some new UI components to an existing site.

If I could use Angular then how would I approach it? How would the Angular components get bootstrapped in the page?

Answer 1

You can definitely use Angular in web app that use other JavaScript frameworks or library. Usually when you do that you use Angular as the main framework. In Angular 2 your Angular app start with a root component so if you insert the root component to some div in your html page the Angular system will not be aware of things outside of the root component (you can achieve that with workarounds but this is not a good practice).

If you want to transform something to Angular you can put all of the html code inside the root component and then slowly transform it to the Angular way (Angular components).