Join the social network of Tech Nerds, increase skill rank, get work, manage projects...
 
  • How to use controller inside the custom directives in AngularJS

    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 462
    Comment on it

    Hello all,

    Working with AngularJS, we can create our own custom directives that helps us to put our common html code in a separate html file and later on we can use it as a html tag, this helps us to make our code much more organizable and reusable.

    To define controller inside our directive we can use the following approach :

    In our html page :

    <html>
    <title></title>
    <head>
        <script src="js/Scripts/angular.min.js">
        <script src="js/app.js">
        <script src="js/directives/AddUserDirective.js">
    </head>
    <body ng-app="myApp">
        <add-user></add-user>
        .
        .
        .
    </body>
    </html>
    

    In AddUserDirective.js :

    app.directive('addUser', ['$scope', function ($scope) {
        return {
            restrict: 'E',
            replace: true,
            templateUrl: 'AddUser.html',
            controller: function ($scope) {
                alert("Hello..!!!");
            }
        }
    }]);
    

    Note : In the above code, the $scope variable will be shared among controller and directive.

 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: