Is zurb-foundation compatible with Angular JS?

Question

I need to migrate an site from one framework to another because I need to use Angular JS. I found zurb-foundation very interesting. It happens that it seems to use jQuery.

According to this website https://scotch.io/tutorials/how-to-correctly-use-bootstrapjs-and-angularjs-together

When building out Angular projects, you should not add on the full jQuery library. jQlite is already included in Angular and this should be all the jQuery that is necessary.

I had a bad experience running Bootstrap and Angular together and I don't want to repeat the same mistake.

It happens that I found the following line at zurb-foundation index.html

<script src="js/vendor/jquery.js"></script>

A quick search has shown that it seems to be a "simplified" version of jQuery (am I wrong?).

I've seem many people questioning things related to Angular in Foundation apps.

My question is: Is Angular compatible with Foundation?

Answer 1

While you'll read in many places that you should stay away from jQuery when using Angular, you'll also notice a subtle "at first" here and there. Angular is quite opinionated, and employs a declarative way of doing things, whereas jQuery is imperative. Check this out for more on the topic.

To answer your question:

Scotch.io's tutorial about Angular and Bootstrap involves UI Bootstrap, a library of directives written in Angular to be able to integrate common Bootstrap functionalities easier.

The equivalent of UI Bootstrap for Foundation is Angular Foundation. I recommend giving this thread a look-over as well, as it contains information that may be relevant to your use case.

So yes, Angular is compatible with Foundation. Happy hacking :)

Answer 2

a quick answer is of course they are compitable with each other. check this out from Zurb. However if you do not want to use JQuery, then the easiest way is to use pineconellc for foundation 5. foundation 6 does not have a port yet as far as I know.