Skip to main content

AngularJS


AngularJS is a JavaScript framework that can be added to HTML page using <script> tag.

AngularJS Usages

  • Client side JavaScript Framework.
  • Extend HTML so you can create more dynamic contents

Declarative vs Imperative 

There are two main programming paradigms used in programming as imperative programming and declarative programming.
  • Declarative: Tells you what to do 
    • You use the declared functions by someone for your needs
  • Imperative: Tells you how to do
    • You develop the functionalities for your needs
AngularJS is both declarative and imperative language. 

Scope

A scope is an object and it stores all the variables and their values.
Each time you create a new controller, Angular automatically create new scope object.

Module

A module is a collection of directives, controllers and other stuff.

  • Create a module
    • var myModule = angular.module("myMod",[]);
    • array contain list of other modules that the defined module depend upon
  • Use the module
    • <html ng-app="myMod">
  • Register the module
    • myMod.controller("myCtrl",main)
      • myCtrl: controller name
      • main: defined function for that controller
  • Use the controller
    • <ng-controller = "myCtrl">

Dependency Injection 

Dependency injection is a software design pattern which enable components to fetch their dependencies instead of hardcoding them inside the component.

Angular Directives

  • ng-app
    • Use to indicate that this is an Angular application
    • Indicate the root of the Angular application (added element is considered as the root element)
  • ng-init
    • Use to write initialization codes
    • But actually, this is not the best way to write initialization codes
  • ng-if
    • Use to check conditions 
  • ng-bind
    • bind the variable values into html elements 
    • one way binding method (data to view)
    • shorthand : {{varaiblename}} = ng-bind="variablename"
  • ng-controller
    • Use to execute functions and initialization code 
  • ng-click
    • Use to execute defined function when defined button click 
  • ng-model
    • Use to fetch the data from the view and update the scope variables
  • ng-hide/ ng-show
    • Use to hide and show some html contents 
  • ng-repeat
    • Use to iterate through loops. 
    • For each iteration, Angular automatically create new scope object
    • Properties : 
      • $index: Return index no of the element
      • $first: Return true if it's the first element
      • $last: Return true if it's the last element

Services 

Services are a reusable component that can use in multiple controllers. 
  • To share the same variable in different controllers
    • ues value service
      • ex : app.value("varName","varValue");
    • Then access in controller function
      • function myctrl(varName){this.variable = varName}
  • To share constant values in different controllers
    • use constant service
      • ex : app.constant("constName","constVal")
  • If you want to get the shared variable value from some complex logic 
    • use factory service
      • app.factory("varName","function")
  • If you want to use constructor functions as variable
    • use service service
      • app.service("varName","constructorFunction")

Promises 

Promises is an alternative way to deal with asynchronous callback functions. Promise represent an operation that hasn't completed yet but is expected in the future.




Comments

Post a Comment

Popular posts from this blog

Object Oriented Programming (OOP)

Object Object is an entity that has state and behavior Class Collection of objects is known as class. There are four main types of OOP concepts Inheritance Object acquire all the properties and behavior of parent object Improve code re-usability Polymorphism One task is performed by different ways Use method overload and override Abstraction Hiding internal details and showing functionality Use abstract class and interfaces Encapsulation Binding code and data into a single unit
Post a Comment
Read more

Sorting Algorithms

Bubble Sort Named as sinking sort. Compare each pair of the adjacent items and swap them if they are in the wrong order. Worst case and average case time complexity both O(n^2)  and best case time complexity is O(n).
Post a Comment
Read more

Java-8

Java 8 New Features There are several new features added in Java 8 version. Some of the important new features are: Define methods inside the interface For each method Lambda Expression Stream API DateTime API 1) Define methods (default, static) inside the Interface After you published your interface, you can't change it by adding some abstract methods. But if you want to add methods you can define those methods inside the interface. Therefore Java 8 support default and static methods inside the interface. In Java 7 version interface only have abstract methods (no method implementation) and an abstract class can have both abstract and non-abstract methods. In Java 8 version you can add method implementation in the interface, but you have to declare that method as default method. ex: default void show(){............} To avoid diamond problem you have to override the method in implementation class if two interfaces have same default method ...
Post a Comment
Read more