Directive Restrictions

on
Directive Restrictions

  Follow the instruction to learn more...
  • E - Element (when you have a camel case in the JS file use inside the tag with -)
  • A - Attribute
  • C - Class
  • M - Comments


File Name: directive-test2-4.js
var tes = angular.module("myApp", []);

tes.controller("AppCtrl", function () {
    var app = this;
    app.message = "Hello";
})

tes.directive("supermanTag", function () {

    return {
        restrict: "A",
        link: function () {
            alert("A meaning Attribute");
        }
    }

})

tes.directive("supermanClass", function () {

    return {
        restrict: "C",
        link: function () {
            alert("C meaning Class");
        }
    }

})

tes.directive("comments", function () {

    return {
        restrict: "M",
        link: function () {
            alert("M meaning Comments");
        }
    }

})



File Name: Session2-4.html

<html>

<head>
    <title>Directive</title>
</head>

<body>

    <div ng-app="myApp" ng-controller="AppCtrl as app">

        <div superman-tag></div>

        <div class="supermanClass"></div>

        <!-- directive:comments -->
        <div></div>

    </div>

    <script src="../node_modules/angular/angular.min.js"></script>
    <script src="directive-test2-4.js"></script>

</body>

</html>


Comments

Post a Comment