[Anuglar] Directive with controller 

<!DOCTYPE html>
<html>
    <head>
        <title>Angular Directive</title>
        <link rel="stylesheet" href="foundation.min.css" />
        <script src="angular.min.js"></script>
        <script src="main.js"></script>
    </head>
    <body ng-app="twitterApp">
        <div ng-controller="AppCtrl">
            <div enter="loadMoreTweets();">Roll over to load more twitters</div>
        </div>
    </body>
</html>
var app = angular.module("twitterApp", []);

app.controller("AppCtrl", function($scope){
    $scope.loadMoreTweets = function(){
        console.log("Loading tweets!");
    }
    
    $scope.deleteTweets = function(){
        console.log("deleting tweets!");
    }    
});

app.directive('enter', function(){
    return function(scope, element, attrs){
        element.bind("mouseenter", function(){
            // scope.loadMoreTweets();
            scope.$apply(attrs.enter);
        });
    }
});

 

posted @ 2014-08-12 19:00  Zhentiw  阅读(202)  评论(0)    收藏  举报