Category
Sort By
In my Angular project, I came across a situation where i had to render some html markup, but the tricky thing was, the markup was contained in some angular scope variable. And when outputting it, it just printed out the html markup as basic text. A quick Google search informed me about the directive ng-bind-html and...
When we are working on front-end part, then many times we face a situation where same HTML repeats on the same page or different pages, at that time we think of making that HTML a component. When using AngularJS framework, we can easily make components with the help of directives. Let's quickly understand what a directive is? A directive...
In my current grails application, we have started using the AngularJS after realizing that the GSP template engine is a bit slow. Now, I realize how efficient AngularJS can be, and think of sharing my first impressions while using AngularJS with grails app. Following are some of the reasons, that I find, makes AngularJS stands out: ...
AngularJS, Front End Development
While using AngularJS, you will usually come across this situation when you want to copy one object to another object. In such case you will have only two solutions: angular.copy() or angular.extend(). Lets see how these solutions work. 1. angular.copy(source, destination) : It creates a deep copy of source object or array and...
AngularJS, Front End Development
While using AngularJS, we come across situation in which we want to display some data in certain format or some specific condition to be applied on the data. In this case, filters comes to rescue. We can define our custom filters and return filtered data in whichever way we want to display it. Lets learn it through an example: ...
AngularJS, Front End Development
In this post we will go through an important aspect of AngularJS i.e., Directives. Directives helps us do things in a better and cleaner way. Lets get into the code rather going into theoretical explanations, which will make it more clear what actually directives do. We have written a simple directive below which shows some HTML when...
AngularJS, Front End Development
The topic of this post is quite confusing for many developers as they face problems in identifying the best practice to share data between controllers in AngularJS. Some of the articles out there tell to use $rootScope but that's not the correct approach to enable this functionality. A more cleaner and better way of doing so is through...
AngularJS, Front End Development
We have already seen the concept of routes and multiple views in my previous blog. Now let's see how to implement it in code. To implement the concept of routing in AngularJS, we need to create modules. Inside a module config, we can define routes. [javascript] File : js/modules.js angular.module('videoModule', []). ...
AngularJS, Front End Development
Need For Multiple Views In all previous examples which I used on AngularJS, there was only a single view, i.e. the view displaying the list of youtube videos. Now let's say we wan't to display a detail page when a video is clicked. On the detail page, we will display more details about the video like author name, comments etc. In this...
AngularJS, Front End Development
In all previous blogs on AngularJS, we used hard coded data. Now, its the time to get more dynamic and play with the data fetched from the server. For this, we will use AngularJS dependency injection which injects various services into the controller. To use a service is even more simpler. We just declare the name of the service as an...
AngularJS, Front End Development
In last blog on AngularJS, we implemented text suggestions functionality. Now, let's consider that we have a list of objects with each object having two or more attributes with their corresponding values. The problem is to get the sorted list of objects based on an attribute selected by user at run time. AngularJS provides us a very quick...
AngularJS, Front End Development
Let's implement text suggestions functionality using AngularJS. It provides suggestions while we type into the text field. For example, if we have a list of fruits and the user types 'ap', it will show all fruit names that contain these letters. [html] <!Doctype html> <html ng-app> <head> ...
