This post demonstrates a complete CRUD application using AngularJS ngResource module with $resource service to communicate with REST API on server. AngularJS ngResource module provides built-in support for interacting with RESTful services, via $resource service. $resource is a higher-level abstraction on low-level $http service used for server communication. If you have a RESTful API on…
Continue readingMonth: December 2015
Angularjs Server Communication using ngResource-CRUD Application
AngularJS ngResource module provides first class built-in support for interacting with RESTful services asynchronously, via $resource service. $resource is a higher-level abstraction on low-level $http service used for asynchronous server communication. It is worth to note down that everything that can be done by $resource can be done by directly using $http. $http is designed…
Continue readingAngularJS Custom-Directives controllers, require option guide
AngularJS Custom Directive’s can have controllers. Controllers in Directive’s are used for inter-directive communication. This post discusses Directive’s controller, require option and controller argument in directive’s link function. Lets get started. This post is a part of AngularJS Directives Tutorial Series. Difference between Directive’s link function & Directive’s controller In previous posts, we have discussed…
Continue readingAngularJS Custom-Directives transclude, ngTransclude guide
AngularJS Directive’s transclude & ng-transclude can be used to create directive that wraps other elements. By-default, AngularJS Directive element replaces any element declared as a child element of directive in HTML, by directive’s own content. But sometimes you way want to preserve the child element and let the directive act as more of a wrapper…
Continue readingAngularJS Custom-Directives replace option guide
AngularJS Directive’s replace option can be used to replace the container element itself by directive content. By default, the directive content inserted as the child of the element directive is applied on. But using replace, that container element altogether can be replaced by directive’s actual content HTML. This post is a part of AngularJS Directives…
Continue readingAngularJS Custom-Directives link-function guide
AngularJS Directive’s link key defines link function for the directive. Precisely, using link function, we can define directive’s API & functions that can then be used by directive to preform some business logic. The link function is also responsible for registering DOM listeners as well as updating the DOM. It is executed after the template…
Continue readingAngularJS Custom-Directives scope guide
AngularJS Directive’s scope key provides us complete control over the scope of our directive element. Our goal while writing a directive should be to avoid polluting parent scope as much as possible. In this post we will discuss various scope related options/strategies including using parent scope, inheriting parent scope and creating an Isolated scope [isolating…
Continue readingAngularJS Directives Tutorial
Directives are AngularJS way of extending HTML. As the AngularJS Official documentation says, they are basically markers on a DOM element (such as an attribute, element name, comment or CSS class) that tell AngularJS’s HTML compiler ($compile) to attach a specified behavior to that DOM element (e.g. via event listeners). In this detailed guide to…
Continue readingAngularJS Custom-Directives restrict option guide
AngularJS Directive’s restrict key defines how a directive can be used in HTML. In this post, we will see all possible configuration options using restrict. This post is a part of AngularJS Directives Tutorial Series. In previous post, our directive was created to be used as an attribute of an existing element, like <div item-widget>…
Continue reading