angular passing $cookie to on click event in a directive
<p>Using angular, I want to save the value of an input to a cookie using directive when clicking on save button.
Here is my code, I wasn't sure if I should use link function or controller directive, but anyway $cookie is of course unknown in the click event handler.
How can I pass $cookie or $log to the on Click function?</p>

<pre><code>.directive('ndUserSettingCookie', ['$cookies', '$log',function() {
return {
    link: function(scope, el, attrs) {
        scope.savedMsg = ' items by page';
        var setting = [];
        scope.itemsByPage = 18;
        scope.itemsByPage = (typeof setting.itemsByPage !== "undefined")? setting.itemsByPage :scope.itemsByPage;

        el.on('click', function() {                     

            var now = new Date(),
            // this will set the expiration to 12 months
            expireDate = new Date(now.getFullYear()+1, now.getMonth(), now.getDate());

            $cookies.putObject('setting.itemsByPage', scope.itemsByPage, {'expires': expireDate});
            scope.savedMsg = scope.itemsByPage + " items per page saved to your settings!";

            scope.$apply();
        })
    }
}
}])
</code></pre>

<p>Please let me know if you think I should do this totally in another way.</p>