Using Angular from another framework?

I’m learning Angular and I started studying it.
Anyway I’m also a programmer of other web framework, in particular WebSharper, and I prefer transpiling JavaScript from F# instead of using TypeScript.
I’ve seen Angular Material UI and it is very cool (more than React Material UI in my opinion).
Now I have a web project and I’d love to put there a Select or a Date Picker from Angular Material UI, so this is my question: which are the options to use a Angular component like those, aside from the obvious possibility to rewrite the whole client in TypeScript/Angular as a spa calling my server web api…
Thank you very much

Sure, but you’ll need to include all of Angular and the component that you want to use wil effectively have to run inside it’s own instance of Angular, so it will have to act as an app within your app, and you will have to manage getting information into and out of that app-within-an-app. It’s a huge amount of overhead. It’s really, really not worth doing this just because you want a nice looking component. It’s also probably not worth rewriting your entire app in angular just because there is a cool datepicker. TBQH, I would just use Fable & the React bindings for Material UI

1 Like

Also W# has react material bindings but the point is that I like angular more than react material components… Ok, I was afraid of that answer… Is it still possible that someone can come up with a smarter trick? Or myself, is it wasted time trying to find a quick hack? Are you sure that the full app in a full app is the only scenario? In that case, - just to know, in theory - which would be the mechanism to share the info in and out?

The material design components for Angular aren’t portable – they are just bits of prewritten Angular code that you can use in an Angular project. Material Design is just a style of design, not a framework, so Angular Material UI is just an implementation of those design patterns in the context of Angular.

IFrames would have been the normal mechanism (you write an angular app, you host it somewhere, you have an iframe in the host app that points at it). It’s horrible, but it would work.

There are also Angular Elements which package up a minimal version of Angular into a web component, which in theory can be dropped into any app. In theory. You also want to incorporate an external library into that, so multiply the complexity.

There are also some other options (metaframeworks for example).

I need to stress that however you do it, it is likely to involve a huge amount of complexity. And you are doing it just because you like the styling. Just writing a date picker with matching styling is by far the better option. Incorporating Angular into another app without very good reason is giving yourself a crazy amount of work for almost no benefit whatsoever.