I would like to use AngularJs and Select2 v4.03 without adding any directives. I've researched that it's possible now with the new version of select2.
For now I've been using ui-select but it's only supporting the old version of select2 and I'd like to use the new select2 features in my application.
Can anyone please help me how is it possible to use select2 with AngularJS directly (maybe via ng-model)?
Select2 is a jQuery plugin which has a completely different approach than AngularJS native widgets (in angular these are directives) which are designed to work the angular-way from the beginning. So normally it is a good idea to use native directives if you can. If you don't find a good replacement, then you also can use jQuery elements, but you have to wrap them in an angular directive to tweak them and make them work the angular-way. This is what projects like ui-select do.
So if the newer select2 is still not available on ui-select you can wait until it is implemented. Or search for another wrapper... Or, search for a native alternative. If you haven't already I would recommend you to take a look at oi-select, for example, which I find quite good and flexible.
Update
Sorry, I just checked, and the select2 implementation from ui-select is a native angularJS implementation of the jQuery version and not just a wrapper.
Related
AngularJS 1.4.x is used on my current project. I have to implement tabs section on page. Is it ok to use Bootstrap's JS Tab or I should move to AngularJS based solution, for example UI-Bootstrap or custom tab library?
I think it is totally ok to use Bootstrap JS tab, but as usual angular developers are also divided into two camps, one who want to do everything in angular way(like creating directives or use UI-Bootstrap directives/components), even when it is a very small task and another who wants to mix jquery/bootstrap library with angular and choose one or another depending on the need.
Angular-UI, will also use the same bootstrap library, but you will get an angularized wrapper over it.
My suggestion, use whatever you are comfortable with and don't bind yourself to one opinion or another.
i want to implement Angular JS, Angular JS UI plugins and bootstrap in my ASP MVC 5 apps. Some people say Jquery is still in use in Angular JS part, so could any one here please explain when and where i would need to use JQuery in Angular Js code?
Angular doesn't include jQuery but a light-weight plugin called jq-lite. This provides a lot of the methods that jQuery does, but not all of them.
It specifically has to do with Angular.element. You can take a look at the documentation here
https://docs.angularjs.org/api/ng/function/angular.element
jqLite is a tiny, API-compatible subset of jQuery that allows Angular to manipulate the DOM in a cross-browser compatible way. jqLite implements only the most commonly needed functionality with the goal of having a very small footprint.
Basically, there are a couple of pointers to keep in mind
Keep all DOM logic outside of the controllers. Use custom directives on attributes for that.
Instead of simulating mouse events, use their angular counterparts. Examples include ng-click and ng-mouseover. Add these directives to the elements in the form of attributes.
Instead of adding classes, use ng-class
If you are using jquery or jqlite, be sure to include the jquery script before the angular script.
Just learning , new to this site.
Is it possible to have ExtJs and AngularJS together in same application ?
or is it worth to have both of them in same application ?
Thanks
Sometimes people use ExtJs components in an AngularJS app.
AngularJS is flexible enough to integrate with any other Javascript code/libraries as long as the library has public events to respond to. I would recommend going through the Directive and scope documentation on how to effectively create directives and respond to scope events.
Personally I do not feel ExtJS and AngularJS would be needed together, unless you are forced to use it like me. There is http://angular-ui.github.io/ that brings in a lot to the table. Again any given JQuery plugin can be integrated using directives, filters etc in AngularJS. So you may want to investigate into that before trying to bother with ExtJS.
Highcharts documentation says that it has some dependencies that can be met with jquery, prototype or mootools. Is there a way to use highcharts/highstock with angularjs without bringing in any of these other libraries?
Angular includes it's own "jqLite" which is a subset of jQuery functions that were necessary (or at least made it much easier) for Angular itself to work. Including jQuery itself will override the jQLite built in to Angular (but they should work fine together and have for me, I'm only using jQuery for ng-grid currently).
Does Angular use the jQuery library?
Yes, Angular can use jQuery if
it's present in your app when the application is being bootstrapped.
If jQuery is not present in your script path, Angular falls back to
its own implementation of the subset of jQuery that we call jQLite.
http://docs.angularjs.org/misc/faq
I've also been looking at charting solutions that will blend well with Angular and have started playing with d3js
http://d3js.org/
Basics of D3js
http://mbostock.github.io/d3/tutorial/bar-1.html
AngularJS D3JS Directive Writing
http://briantford.com/blog/angular-d3.html
D3 essentially gives you a toolkit of functions that help to scale values to build a chart from scratch and has built in interpolation for transitions between data sets. There seem to be lots of cool examples but to build from svg or html elements into your desired chart from scratch is probably extensive work.
For something a little more pre-built and I believe without external dependencies either is Google Charts
https://developers.google.com/chart/
AngularJS Google Charts Directive
http://bouil.github.io/angular-google-chart/
Yes, there is.
Highcharts relased a Standalone version
Check it out, I think it's a more direct answer to your question than what was posted here.
Also, there's an Angular Directive for Highcharts:
Highcharts-ng by PabloJim
Also, for more info check out a similar question: Highcharts in AngularJs without jQuery?
I was reading that AngularJS comes with a lite version of jQuery. However I keep hearing reference to people who talk about Angular and jQuery going together. I even checked out ng-grid and noticed that it says:
Angular Data Grid written in AngularJS and jQuery by the AngularUI Team
So if I do use Angular just when would I need jQuery and what does the version that comes as part of AngularJS not provide?
jQLite is a very stripped-down version of jQuery. jQLite is enough for angular to work. This is to minimize dependencies.
Yet, if you load jQuery before angular, then angular will use jQuery.
Most of the time, you do not need to use jQuery. Even so much that, for beginners, it is advised to leave out jQuery completely as there would be a tendency to use jQuery when there is an easy / angular way. There has been so many examples on this (mostly showing and hiding elements through jQuery when there are ngShow and ngHide directives).
Later on, when you start to write directives, you then may need to add jQuery.
ngGrid possibly does many things for which jqLite would not suffice. Thus, they used jQuery.
Documentation and features of jqLite:
http://docs.angularjs.org/api/angular.element