title: AngularJs | ng-click not firing
body: <p>I can see no apparent reason why the <code>ng-click</code> shouldn't work, however it does not fire when clicking the element it is bound to.</p>
  <p>There are two elements that will be rendered. Each one has an icon X on on the top right of its div which should fire <code>deletePreview</code>. This will lead currently to the deletion of the first item of <code>linkPreviews</code>. When invoking this method by <code>$timeout</code> e.g., it works as expected. Trying to click on the icon however is not working.</p>
  <p>I'm glad for any ideas.</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>(function (angular) {
    'use strict';
  
    angular
      .module('commons.ui')
      .directive('linkPreview', linkPreview)
      .controller('LinkPreviewController', LinkPreviewController);
  
    function linkPreview() {
      return {
        restrict: 'E',
        replace: true,
        templateUrl: 'link-preview/link-preview.html',
        scope: {},
        require: 'ngModel',
        bindToController: {
          focusVar: '=?',
          placement: '@'
        },
        controller: 'LinkPreviewController',
        controllerAs: '$ctrl'
      };
    }
  
    function LinkPreviewController($log, $timeout) {
      var vm = this;
      vm.deletePreview = deletePreview;
  
      vm.linkPreviews = [
        {
          image: {
            fileId: 'f616157b-223d-46ff-ba87-c16d10e83ed6',
            senderId: '1ae6f889-f27e-4466-a0a9-021923704097'
          },
          title: 'Title',
          description: 'This is an integrated platform for your official company news, social collaboration and team messaging.',
          url: 'http://www.sample.com/en/tour',
          tld: 'sample.com'
        },
        {
          image: '',
          title: 'Hacker News',
          description: 'News for the technically interested',
          url: 'https://news.ycombinator.com/',
          tld: 'news.ycombinator.com'
        }
      ];
  
      function deletePreview() {
        $log.info('should be deleted');
        vm.linkPreviews.splice(0, 1);
      }
    }
  })(angular);</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div ng-repeat="linkPreview in $ctrl.linkPreviews"&gt;
      &lt;div class="link-preview"&gt;
          &lt;div class="link-preview-delete pull-right"&gt;
              &lt;div class="link-preview-delete pull-right"&gt;
                  &lt;span class="link-preview-delete-button" ng-click="$ctrl.deletePreview()"&gt;
                      &lt;i class="zmdi zmdi-close img-close"&gt;&lt;/i&gt;
                  &lt;/span&gt;
              &lt;/div&gt;
          &lt;/div&gt;
          ..
       &lt;/div&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>