AngularJS Basic

Sharing Knowledge is always advisable

WHAT is AngularJS?

AngularJS is a JavaScript framework that is intended to make it easier to implement RIA web applications.

AngularJS is based on the MVC pattern (Model View Control). Therefore AngularJS separates your RIA application into models, views and controllers. The views are specified using HTML + AngularJS's own template language. The models and controllers are specified via JavaScript objects and JavaScript functions. Thus, the views are specified declaratively, as HTML normally is, and the models and controllers are specified imperatively, as JavaScript normally is.



AngularJS extends HTML with ng-directives.
The ng-app directive defines an AngularJS application.
The ng-model directive binds the value of HTML controls (input, select, textarea) to application data.
The ng-bind directive binds application data to the HTML view.

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>
</head>
<body ng-app>
    
    <div>
        <h1>
            Hello World!</h1>
        <p>
            I'm AngularJS. Here is your AJAX-powered text: <span style="color: fuchsia;"> <b><p ng-bind="txt"></p></b></h1>
            <p>
                Enter message:
                <input type="text" ng-model="txt" /></p>
    </div>
   
</body>
</html>

AngularJS starts automatically when the web page has loaded.
The ng-app directive tells AngularJS that the <body> tag is the "owner" of an AngularJS application
The ng-model directive binds the value of the input field to the application variable txt.
The ng-bind directive binds the innerHTML of the <p> element to the application variable txt.

No comments:

Post a Comment