javascript - Angularjsはディレクティブでデータを取得します

Question

AngularJs でブログを書いています。私はそれが初めてです。私は BlogController と BlogData サービスを作成しています。BlogController は BlogData を使用します。BlogData は $http を使用してサーバーからデータを取得します。私のコントローラーはこのように;

barbarapp.controller('BlogController', function ($scope, blogData) {
    $scope.blogPosts = blogData.getBlogPosts(0);
});

このような blogData サービス。

barbarapp.factory('blogData', function ($http, $q) {
    return {
        getBlogPosts: function (pageNumber) {
            debugger;
            var deferred = $q.defer();
            $http({
                url: 'Blog/GetBlogPosts',
                method: 'POST',
                data: { 'pageNumber': pageNumber }
            }).success(function (response) {
                deferred.resolve(response.posts);
            });
            return deferred.promise;
        }
    };
});

それは正常に動作します。そして、ページネーション用のディレクティブを作成しています (ディレクティブは jquery ページネーション ライブラリを使用します)。このようなページネーションディレクティブ;

barbarapp.directive('createPagination', function (blogData, $q) {
    return function (scope, element) {        
        $(element).pagination({
            items: scope.postCount,
            itemsOnPage: scope.itemsOnPage,
            cssStyle: "light-theme",
            onPageClick: function () {
                var posts = blogData.getBlogPosts(this.currentPage);
                scope.blogPosts = posts;
            }
        });
    };
});

ディレクティブは正常に機能しますが、未定義の onPageClick に投稿します。なぜ仕事ではないのですか？