Featured
-
How Regression Testing Detects Integral Errors In Business Processes
Humans are forever changing and evolving and so to
by kristina.rigina -
Get Display Banner Advertising Opportunity on FindNerd Platform
“Do you have a product or service that nee
by manoj.rawat -
Android O Released with Top 7 New Features for App Developers
Android was founded by Andy Rubin, Rich Miner, Nic
by sudhanshu.tripathi -
Top 5 Features That Make Laravel the Best PHP Framework for Development
Laravel is a free open source Web Framework of PHP
by abhishek.tiwari.458 -
Objective C or Swift - Which Technology to Learn for iOS Development?
Swift programming language is completely based on
by siddharth.sindhi
Tags
Simple AngularJs Application Using Asp.Net MVC
In this blog,we will learn to create a simple angularjs application using Dotnet Framework.So Let's start to implement it step by step.
1.Open Visual Studio and Create a New MVC project.
2.Now create a MVC5 Empty...
multiple angular app in one page
While working in jsp with some parts common in few pages and ran into a problem to attach multiple apps to a single jsp page. After doing lot of search I found this one the best solution. Create a new app and take all other apps as an parameter. ...
jquery autocomplete in AngularJs not working on first click
Hi,
I was using jquery autocomplete functionality in angularJs using directive. Whenever I tried to load static data it was working fine, but when I loaded data from server side the first click was not working.
I was using code someth...
Understanding directives in AngularJS
Directives are an important feature of AngularJS which are used to extend HTML and create reusable and testable code. The framework provides a set of rich built in directives and we can also build custom ones if required. In this tutorial w...
Understanding AngularJS Bootstrap Process
Bootstrap process in angularJs is simple and you should know about it. There are two ways of bootstrap process in angularJs:
Automatic Bootstrap
Manual Bootstrap
Automatic Bootstrap:
When we run our angularJs App the DOM(Document Ob...
Understanding Data Binding in AngularJS
In this post, you will learn about the data binding in angularJs. It is one of the powerful feature which angularJs provides.
There is two-way data binding in angularJs to bind data between model and view.
The data binding mechanism is handle...
Understanding scopes in AngularJS
An AngularJS application uses an object called $scope which is shared between controller and view. This object holds the Model data that is passed to the View and acts as a glue between Controller and View. In this blog we will dive d...
Form Validation with AngularJS and ASP.NET MVC
In this blog, we will learn about form validation in AngularJS. From Angular 1.3 onwards, ngMessages module has been introduced and we will be using the same for form validation. Before the addition of this module, developers had to make use dire...
Using AngularJS and ASP.NET MVC to create a Hello World Application
In this article we will learn to create a simple Hello World application using AngularJS framework and ASP.NET MVC.
AngularJS : Introduction
AngularJS is JavaScript framework used for creating single page web applications and is m...
Form Validation in AngularJS with ngMessages
In this post, you will learn about ngMessages directive in angularJs and how it can help to show error messages in your application. ngMessages provides custom form validation facility to display error messages in angularJs.
Let’s start ...
Understanding $emit, $broadcast in AngularJS with example
The services yield by Anjularjs which can be utilized for communication based on event between controllers are $on, $emit, and $broadcast. These are under the publish/subscribe design pattern of angularjs i.e. you can publish an event somewhere a...
Integrate Postgresql with Node JS
Many Programmers feel comfortable to use Postgre SQL rather than MongoDB, member of MEAN Stack.
We are going to integrate Postgresql with NodeJS
To install NodeJS, please go through this Article
Now, when we are finished with Installatio...
Angular BlockUI - An Overview
What you will learn from this blog:
1. What is Angular BlockUI
2. How to use it in view and js
3. Learn how it will remove unnecessary hide and show of loader during each ajax request
4. how it will reduce line of code
If you are looking...
$this vs $scope in AngularJs
$scope and $this are the mostly used in AngularJs.
But we often caught up in a perplexed situation, which one we should use.
whatever we define in a certain block(or DIV) of HTML, all the variables comes under the $scope or this.
for exa...
AngularJs Filter
When we want to format data in angularJS then we use filter.There are n number of filter available in angularJS which is used to transform data. AngularJS filter are:
1) Currency: Which will format a number to a currency format.
2) date:Whi...
Searching and Pagination in AngularJs.
Hi All,
This blog is about pagination and searching in angularjs.
In web applications, we have large amount of data to display and generally we use tables and lists.Searching and pagination makes it easy and user friendly.
First lets sta...
Angularjs Scope
In AngularJS, Scope is a javascript object by which we can join our controller with the views. In scope we will contain model data which we can access by using $scope object. The use of $scope is easily explained by the simple example.
Example...
Manual and Automatic bootstrapping in AngularJS
In Javascript framework like AngularJS there is a bootstrapping process involved and there are certain flow that is involved in it.
There are two types bootstrapping involved in AngularJS:
Automatic bootstrapping
Manual Bootstrapping
...
Chapter 4:Angularjs Services
In previous blog we have take knowledge about how we will use angularjs and how important role directives play while using angularjs.If you have not read previous blog then kindly request first read that blog then carry forward to read this ...
Chapter 3: Angular.js with UI Logic(Controller)
In the previous chapter we have discuss what is angularjs and what are the directives before proceeding to next chapter where we will practically try to implement all this it is necessary to know about angular.js definition and directives.
As ...
How to make a simple timer in angularjs
Hi all,
We are going to implement count-up timer. In Count up timer, timer starts from 00:00:00 to time you defined. It is used to show duration for example video duration , call duration , etc
In Html file , Just add binding variable in yo...
Initialize AngularJS Model with MVC Model
Hi All,
When we need to use AngularJS to bind controls with AngularJS Model but we have MVC Model filled through MVC Controller, we can follow below steps to do the same without using "ng-init".
Step 1: Create two js files in Scri...
Bind Dropdown using AngularJS
Hi All,
This log will help you to bind data to dropdown/html select control using AngularJS. Data is populated using webmethod.
<select ng-options="Country.CountryName for Country in CountryList" ng-model="selectedCountry">
</se...
Stop Event Propagation on click in AngularJS
Sometimes you have a click event on parent div as well as child elements of it. If you click on the child element, it automatically calls the parent click function along with its own function. This is called event bubbling. To restrict or stop th...
Get HTML element using class name or Id in AngularJS
Hi All,
In this blog we will see how easy is to get HTML element in AngularJS. We many a times stuck in situation where we need to get HTML element that are not bind to AngularJS Model. Here is quick and easiest way of doing that.
Using Cla...
Use of ng-cloak in AngularJS
Hi All,
When we use AngularJS in any of our page, while rendering it on browser we happen to see flicker in HTML with uncompiled raw html. And once the AngularJS is compiled then it will show the compilled output. To avoid this flickering we c...
Add HTML Content To div Using AngularJS
Hi All,
Making a webpage dynamic , you need to add/remove control from you HTML file. Building web application containing multi data entry fields is only possible if your web application is working dynamically with controls. In this case, you ...
Sharing Data Between Controllers in AngularJS
Hi All,
To share data between two controller you should have your factory return an object and let your controllers work with a reference to the same object:
A simple example in which two controllers are sharing name of a user.
TEST.html...
How to bind application data to attributes of HTML DOM elements?
The following directives are used to bind application data to attributes of HTML DOM elements:
1.ng-disabled Directive:-
This directive is used to disable any attribute (button,checkbox,etc).
Add ng-disabled...
Changing button text (toggle text) on click in AngularJS
We can make a button behave like a toggling button by making a directive in AngularJS. It is very simple. You just need to bind the attribute and then check the condition.
First create a simple HTML :-
<html>
<head>
...
Redirect to a new page/url in AngularJS
We use $location service or $window to redirect to a new URL. $location exposes the URL to the browsers address bar and makes it available to the application. It reflects the changes either side ,i.e. synchronizes the changes and maintains it bet...
AngularJS - $interpolate, $compile and $parse
There are three useful services provided by AngularJS for view rendering and evaluating expression which it uses internally.
$interpolate :- This service simply takes a string and is used to evaluate expressions. We can run the entire string...
Angular $q,promises and deferred.
Promises are logics that are executed after any function is completed. In AngularJS, promises are provided by the in-built $q service. It executes asynchronous functions by registering them with the promise object.
Deferred helps ...
What is $rootScope and how is it related with $scope?
$rootscope is the parent of all scopes. Values exposed there will be used in all controllers and templates. It acts as a parent object of all “$scope” angular objects created in a web page.
Now, let us understand how the “$ro...
How to populate options in select in angularjs with example
The dynamically generated option in the select box with angularjs is done with the following code :
We can populate the options inside the select box and on selecting any value from the select box it reflect to some event. It will sh...
AngularJS http (ajax)
AngularJS has provided a $http service that works as an ajax call in jquery. It performs a function of reading data from the server. $http makes a call to the database and retrieves the desired data or records.
How to use?
1. you need to in...
What problems does AngularJS solves?
AngularJS is a framework ( client-side ) for web applications that embeds HTML, CSS and Javascript. It basically focuses on:-
1.Coding data access, Reading, form validations - are some functions in which many people are not good at while doing...
$watch() , $digest() and $apply() in AngularJS
There is an important concept of angularjs $scope function like:
$watch
$digest
$apply
As to understand angularjs more better we have to go throught the central function in angularjs.
Lets discuss them one by one:
...
Different ways of using array filters in AngularJS
AngularJS provides a filter feature to format input value and an array based on certain criteria. Here, we will see the ways of array filtering.
For example-below is the array:-
$scope.movies = [
{id: 1,title: Airlift, genre: real ...
AngularJS $apply
AngularJS $apply comes into play when it invokes digest cycle to watch the scope model changes. Angular wraps the function call within the $scope.$apply. It means it executes a complete new life cycle. If the execution of the function is normal, ...
AngularJS $digest
Since AngularJS has a popular concept of two way data binding. But how does it comes to know that a value has changed? Here comes the role of $digest.
AngularJS executes in cycles which is called as $digest cycle. Suppose we ch...
Understanding Angular $watch
AngularJS has a concept of powerful data binding. It accomplishes this by keeping a watch on its scope variables. When we change the the variable on $scope object, the $scope object gets automatically changed and vice-versa. Most of the time angu...
AngularJS $timeout and $interval
$timeout and $interval are two AngularJS timer services. We use these services to call functions and these are similar to javascript’s setTimeout and setInterval functions.
$timeout- This is used to call a function and schedules a single c...
Iterate json data in angularJS
While working for an autocomplete funtionality in angularJS encountered a problem where instead of the JSON we need to iterate each element and have to make an Array of string.
For iterating the JSON data(from server side), we used:
$scop...
AngularJS expressions
Expressions in AngularJS is represented using double curly braces-{{ }}. Expressions are used to bind the data to the HTML in the same way as the ng-bind directive of angular.
Expressions using-
1.numbers:-
syntax- <p>Price...
Understanding Angular UI-Router
In Angular we are provided with a routing framework named Angular UI-Router. It enables us to make transitions based on states rather than routes URL (which is used in ngRoute),i.e. it is organized around states. It supports nested states and mul...
MVC architecture in angular
Model View Controller is abbreviated as MVC. MVC is the popular web design architecture because it separates the business logic from its view or presentation.
It has three components:-
Model- an object carrying data.
View- visualization ...
Single Page Applications using Angular
Single page applications are the applications that separates the model and the view layer i.e, model layer handles the data and view layer reads from the models.
SPA’s are becoming popular because it retrieves all the code(JS,HTML,CSS) on ...
AngularJS Dependency Injection in detail
Dependency Injection allows the removal of hard-coded dependencies and makes it possible to change them. It helps in making components testable,reusable and maintainable.
We are provided with in built dependency injection mechanism by AngularJs....
Promises in Angularjs
Promises - AngularJS's promise provides a built-in service $q. It provide a way to execute asynchronous call in series by registering it with a promise object.
Let us now elaborate promise and deferred.
Deferred - It represent the ...
