Currently I'm looking for a plugin/js that I can use to show my users a small walkthrough of my site. I have jquery and angular both running on my page.
I have been using Chardin.js (https://github.com/heelhook/chardin.js). This plugin works and is simple, however when i try to include angular elements chardin.js will not be able to find the elements to display.
SO I'm trying to find a way to integrate this plugin with angular. Unless there are some better plugins that work better for this in angular. Thanks!
I agree with #Ben_Coding,
Angular-Intro is pretty good, light-weight, and no dependency on jQuery.
Related
I am working in a project which is developed using AngularJS1.2, since it is older I am thinking to write feature modules in separate app using Angular and then with the help of Microfrontend thinking to combine with older app. To achieve this, I am not able to get a good source/guide. Can anyone please help me.
I see 3 ways but haven't tried any of them though. So, I don't have any working solution.
Have a route from angularjs that points to angular app(full page load) and everything from there onwards, angular handles everything. There is no angularjs involved. This may not be the best option.
Let angular code load on demand when the feature is required and provide placeholders for the angular features inside angularjs project. This way you can share custom scope to nested child angular project.
Use web components developed in angular(angular elements) and use them in your angularjs application. They work independent of technology/framework/library.
I have been looking for some good ways to build up a angular website with help of basic html templates but it doesn't work with carousel and some other elements.
Can any suggestion for slider in angular?
Angular doesn't necessarily play nicely with jQuery plugins.
(I'm assuming you are using a jQuery carousel, you didn't say though).
That doesn't mean you can't use Jquery plugins, it just means you can't use them in a very Angular way.
Best to use Angular modules instead wherever possible.
See carousel at ...
https://angular-ui.github.io/bootstrap/
This is a reliable library
Hope this helps
Angular slider here ... https://github.com/seiyria/bootstrap-slider ... but I've never tried it
I didn't see any guide on the website. Can we use polymer with angular.js?
Others options?
We are currently investigating the use of Polymer alongside Angular and this article gives a demonstration on how it can be achieved:
Using Polymer WebComponents with Angular.js
The author does conclude by saying not to mix the two worlds, but he admits that is just an opinion.
Binding values from Angular to Polymer seems to work well. The issue is controlling the flow of information out of Polymer back into Angular.
This directive helps with this:
angular-bind-polymer
There are a couple of things I don't quite like with this:
You have to decorate your elements with the directive.
You have to enable reflectToAttribute in your Polymer element, which if it is a large javascript object for example could be ugly.
Having said all that it works, so if you think it will work for you then evaluate it.
You might want to start with the aptly named Polymer Starter Kit.
As for use with Angular, Polymer elements work well with Angular 2.0, currently in Alpha.
I'm having a hard time setting up a project with angular and foundation 3 (rails in backend). So I have been searching a lot but there aren't many results.
I'm serving angular from a subfolder (localhost:3000/app), and started the html something like this
!!!5
%html{ "ng-app" => "App" }
%head
-# I tried this for html5 url on angular, not so much help so far
%base{:href => "/app/"}
%title
NG APP
...
%body
%header
...
%main
= yield
%footer
...
= javascript_include_tag "application"
= yield :javascripts
A couple of view work just fine. But when I tried to use the foundations tab, I could make work, because angular pass the anchor as a url that shold be check against $routeProvider.
So, I check some question here, and part of the answers give me the impression that foundation work fine enabling html5 mode in angular. (Which I could make it) and other answers say that in order to make work foundation with angular should write a directive for every component on foundation. Or the last case is moving to Twitter Bootstrap.
So, I can find a unified answer, could you please, confirm if right now I can use foundation with angular in a direct way. Thanks.
The best choice would be wrapping Foundation plugins in angular services or using only CSS/SASS provided with the framework and recreating the behaviour from scratch. Focus on prototyping using markup + stylesheets and then create logic in the angular way. At least, this is what I would do if I needed / had to use Foundation.
Twitter Bootstrap works in a similar way and the only advantage of moving to this framework is the fact that you can find plenty of angular modules / directives wrapping available plugins. In this case you wouldn't have to do the same job twice and well.
Take a look here: http://mgcrea.github.io/angular-strap/ in the first place.
Then look for bootstrap-based components in Bower.io Components Directory
Also, as some people in the comments have mentioned, you might need to bootstrap you application manually, which is as simple as wrapping you app in a module and running:
angular.bootstrap(element[, modules]);
// http://docs.angularjs.org/api/angular.bootstrap
As I said, it's usually better not to reinvent the wheel.
Edit:
There's an interesting discussion on Google Groups regarding this topic (and unsurprisingly users' conclusions are quite similar): https://groups.google.com/d/msg/angular/Htkzt7Fsaog/TeFm5l4snTwJ
Here is an almost complete adaptation of the Angular UI Bootstrap components to the Foundation CSS: http://madmimi.github.io/angular-foundation/.
You can use the angular-ui-foundation library on github, its probably the best place to start from,
https://github.com/mhayes/angular-ui-foundation
Newbie here...
Building an app in Angularjs and now I want to incorporate iScroll features. Has anyone done that before? If so, can you share some tips?
Thanks
This is a little late, but I released a AngularJS Directive that helps in getting iScroll to work correctly. See https://github.com/ibspoof/ng-iScroll
I tried ng-iScroll, but ended up writing angular-iscroll because I wanted the ability to turn iScroll on and off during runtime, and ng-iScroll was unnecessarily complicated (for example, you don't need to specify an element's ID in an Angular directive).
Also, I developed core-layout, a demo web app showing how the angular-iscroll directive can be used in a responsive-design app with support for both scrolling drawer (slide-out) menus and modals.
This seems like a better question for the angularjs google group. That is where I found this discussion (google search)
https://groups.google.com/forum/?fromgroups=#!searchin/angular/iscroll/angular/EBHrwhPPJyg/VnubgpLKq9IJ