Scribd Logo
Upload

Welcome to Scribd!

  • 22 views

    An Implementation Tour To Angularjs: Preeti Yadav# Bhupender Singh#

    Uploaded by

    Editor IJRITCC
    The document discusses AngularJS, an open-source JavaScript framework. It describes key AngularJS concepts like two-way data binding, MVC architecture, filters, templates, and dependency injection. It also outlines the basic working architecture of AngularJS, including how it initializes, loads modules, and compiles the DOM. Finally, it provides an example implementation of an employee management system using AngularJS, Yoman, and other tools to demonstrate concepts like adding and sorting employees and using multiple views.

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd

    An Implementation Tour To Angularjs: Preeti Yadav# Bhupender Singh#

    Uploaded by

    Editor IJRITCC
    22 views3 pages
    The document discusses AngularJS, an open-source JavaScript framework. It describes key AngularJS concepts like two-way data binding, MVC architecture, filters, templates, and dependency injection. It also outlines the basic working architecture of AngularJS, including how it initializes, loads modules, and compiles the DOM. Finally, it provides an example implementation of an employee management system using AngularJS, Yoman, and other tools to demonstrate concepts like adding and sorting employees and using multiple views.

    Original Description:

    Original Title

    69 1500708342_22-07-2017.pdf

    Copyright

    © © All Rights Reserved

    Available Formats

    PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    The document discusses AngularJS, an open-source JavaScript framework. It describes key AngularJS concepts like two-way data binding, MVC architecture, filters, templates, and dependency injection. It also outlines the basic working architecture of AngularJS, including how it initializes, loads modules, and compiles the DOM. Finally, it provides an example implementation of an employee management system using AngularJS, Yoman, and other tools to demonstrate concepts like adding and sorting employees and using multiple views.

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd
    Download as pdf or txt
    22 views3 pages

    An Implementation Tour To Angularjs: Preeti Yadav# Bhupender Singh#

    Uploaded by

    Editor IJRITCC
    The document discusses AngularJS, an open-source JavaScript framework. It describes key AngularJS concepts like two-way data binding, MVC architecture, filters, templates, and dependency injection. It also outlines the basic working architecture of AngularJS, including how it initializes, loads modules, and compiles the DOM. Finally, it provides an example implementation of an employee management system using AngularJS, Yoman, and other tools to demonstrate concepts like adding and sorting employees and using multiple views.

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd
    Download as pdf or txt
    of 3

    International Journal on Recent and Innovation Trends in Computing and Communication ISSN: 2321-8169

    Volume: 5 Issue: 7 358 360


    _______________________________________________________________________________________________

    An Implementation Tour to AngularJS

    Preeti Yadav# Bhupender Singh#


    #Extension Lecturer in Govt College Gurgoan (Haryana) #District Manager in HSWAN Project at Narnaul (Haryana)
    [email protected] [email protected]

    Abstract:- Angular Java Script Framework extends the HTML attribute.It easily binds the data to HTML with expression only for adding the
    Script tag in HTML coding. Angular Java Script Framework is mostly used for making the dynamic web page as well as also increase the web
    performance. The paper totally revolves around how to create client side applications.

    Keywords:- JS, MVC,DOM,HTML

    __________________________________________________*****_________________________________________________

    I. INTRODUCTION: KEY FEATURES:


    Angularjs is a javascript Framework . Its angular library Two Way Data Binding
    written in javascript. Angularjs extends HTML with NG- MVC design pattern
    directives. Filters
    An angularjs application is defined by the NG-model Templates
    directive and NG-bind directive binds application data to the Dependency Injection
    HTML view. Directives
    Unit Testing
    REASONS BEHINDS TO USE OF ANGULARJS Deep Linking
    DATA BINDING - AngularJS provides a powerful data Context Aware Communication
    binding mechanism to bind data to HTML elements byusing DOM manipulation
    scope.
    Controller

    CUSTOMIZE & EXTENSIBLE - AngularJS is customized and 1) SCOPEis a JavaScript object that refers to the application
    extensible as per you requirement. You can createyour own model. It acts as a context for evaluating angular
    custom components like directives, services etc. expressions. Basically, it acts as glue between controller and
    view.
    CODE REUSABILITY - AngularJS allows you to write code
    which can be reused. For example custom directive which
    you can reuse.

    SUPPORT AngularJS is mature community to help you. It 2) MODULE:- the module is a storage area for the different
    has widely support over the internet. Also,AngularJS is parts of an application and its controller, that always belong
    supported by Google which gives it an advantage. to a module. It is created with the syntax of angularJS
    function angular Module.
    COMPATIBILITY - AngularJS is based on JavaScript which
    makes it easier to integrate with any other JavaScript library 3) CONTROLLER:- it controls the angular JS application . A
    and runnable on browsers like IE, Opera, FF, Safari, controller is a JavaScript object and created by Java Script
    Chrome etc. Constructor.

    4)DIRECTIVES-AngularJS directives are a combination of


    TESTING - AngularJS is designed to be testable so that you
    AngularJS template markups (HTML attributes or elements,
    can test your AngularJS app components easyas possible. It
    orCSS classes) and supporting JavaScript code. The
    has dependency injection at its core, which makes it easy to
    JavaScript directive code defines the template data and
    test.
    behaviors of the HTML elements.. There are some built-in

    358

    IJRITCC | July 2017, Available @ http://www.ijritcc.org


    _______________________________________________________________________________________
    International Journal on Recent and Innovation Trends in Computing and Communication ISSN: 2321-8169
    Volume: 5 Issue: 7 358 360
    _______________________________________________________________________________________________
    directives provided by AngularJS like as ng-app, ng- Getting Started:
    controller, ng-repeat, ng-model etc. 1) Run grunt build & grunt serve command to build
    & serve the application.
    5) FILTERS:- Filters
    are used to format data before displaying it I am attaching some snapshots of application.
    to the user. They can be used in view templates, controllers, i) Home Page
    services and directives. There are some built-in filters
    provided by AngularJS like as Currency, Date, Number,
    Order By, Lowercase, Uppercase etc. You can also create
    your own filters.

    6)DI: Dependency Injection (DI) is a software design pattern


    that deals with how components get hold of their
    dependencies. AngularJS comes with a built-in dependency
    injection mechanism. You can divide your AngularJSapp
    into multiple different types of components which
    AngularJS can inject into each other.

    II. WORKING ARCHITECTURE OF ANGULARJS :-


    ii)Add a new Employee

    ii) Sort and Search


    Angular initializes automatically upon DOM Content
    Loaded event or when the angular.js script is downloaded to
    the browser and the document. ready State is set to
    complete. At this point AngularJS looks for theng-app
    directive which is the root of angular app compilation and
    tells about AngularJS part within DOM. When the ng-app
    directive is found then Angular will:
    1. Load the module associated with the directive.
    2. Create the application injector.
    3. Compile the DOM starting from the ng-app root
    iii) Multiple Views
    element.

    III. IMPLEMENTATION
    For implementation the concept of angularJS framework ,
    we take an employ management system. This application is
    created using yoman & uses npm & bower modules with
    grunt ad build tool.
    This application code is shared on github repository. To
    clone & download the code please refer to below github link
    Linkhttps://github.com/priti16rao/EmpMgtSystem.git

    359

    IJRITCC | July 2017, Available @ http://www.ijritcc.org


    _______________________________________________________________________________________
    International Journal on Recent and Innovation Trends in Computing and Communication ISSN: 2321-8169
    Volume: 5 Issue: 7 358 360
    _______________________________________________________________________________________________
    IV. CONCLUSION
    In this paper , we examine the Employ Details and
    check the effectiveness of given Automated details by
    creating the Employ Details on angularjs.

    REFERENCES
    [1] http://www.w3 schools.com/angular
    [2] http://research .google.com
    [3] AngularJS:A modern MVC Framework In JavaScript by
    nilesh jain in Journal of Global Research In Computer
    Science, Volume 5, No.12, december 2014.
    [4] http://Github.com/angular5)https://www.tutorialspoint.co
    m/angularjs

    360

    IJRITCC | July 2017, Available @ http://www.ijritcc.org


    _______________________________________________________________________________________

    You might also like