Join the social network of Tech Nerds, increase skill rank, get work, manage projects...
 
  • AngularJs Controllers

    • 1
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 853
    Comment on it

    Hii,
    This blog is continuation with my previous blogs on AngularJs,In my previous blog i had discussed about the following:
    What is angular js,angularJs directives and expressions.
    In this blog i am going to discuss about controllers in angularJs with the help of an example.

     

    • While creating any angularJs application, we use controller which is among one of the important angularJs directives.
    • Controllers are used to add functions,create logics and controls application data to produce a dynamic output of application data.
    • A Controller is a object defined inside a controller function.
    • ng-controller:Controllers are defined with a prefix 'ng' inside any html tag.
    • This ng-controller directive is used to define the controller scope.

    Now,Go through this simple example:

    <div ng-app="firstApp">
    	<div  ng-controller="firstCtrl">
    <p>I am {{ Name + " " + Age }} old</p></div>
    <div first-Directive ></div>
    </div>
    var app = angular.module("firstApp", []);
    app.controller("firstCtrl", function($scope) {
        $scope.Name = "seema";
        $scope.Age = "12yrs";
    });
    app.directive("firstDirective", function() {
        return {
            template : "This is an example of directive constructor"
        };
    });

    OUTPUT:

    I am seema 12yrs old

    This is an example of directive constructor

     

    NOTE: Must include this link in your file

    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>

 0 Comment(s)

Sign In
                           OR                           
                           OR                           
Register

Sign up using

                           OR                           
Forgot Password
Fill out the form below and instructions to reset your password will be emailed to you:
Reset Password
Fill out the form below and reset your password: