Directives using scope and attrs to trigger the function

on
File Name: directive-test2-6.js

var tes = angular.module("myApp", []);

tes.controller("AppCtrl", function ($scope) {
    $scope.loadMoreTweets = function () {
        alert("Loading Tweets");
    }

    $scope.deleteTweets = function () {
        alert("Delete Tweets");
    }
})

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

    return function (scope, element, attrs) {
        element.bind("mouseenter", function () {
            console.log("enter");
            scope.loadMoreTweets();
            scope.$apply("loadMoreTweets()");
            scope.$apply(attrs.enter);
        });
    }

})


File Name: Session2-6.html

<html>

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

<body>

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

        <div enter="deleteTweets()">Roll over to load more tweets</div>

    </div>

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

</body>

</html>

Comments

Post a Comment