Как превратить mdGridTile в ссылки

У меня есть аналогичный вопрос, как этот поток, но ответ, похоже, больше не указан. У меня есть список плиток, которые показывают изображение свойства и некоторую релевантную информацию. Я хотел бы, чтобы каждый был полной ссылкой на другую страницу с дополнительной информацией о собственности.

Я сделал свои плитки в директиве, и в настоящее время содержание html этой директивы завернуто в якорный тег. Который работает для достижения указанной ссылки, однако этот якорный тег соответствует высоте mdGridTileFooter.

Есть ли способ сделать все плитки интерактивными? Чтобы пользователь мог щелкнуть по любой его части и получить доступ к намеченной ссылке (а не только нижнему нижнему колонтитулу?

Директива HTML:

<a ng-click="spVm.linkToProperty(proforma)" ng-href="{{spVm.path}}">
<div>
<md-grid-tile-footer class="saved-prop-address">

  <div class="saved-prop-address-title" ng-bind="spVm.city"></div>

  <div class="saved-prop-address-subtitle" 
   ng-bind="proforma.listing.update_date | date: 'MMMM dd'"></div>

</md-grid-tile-footer>
</div>
</a>

Страница HTML с списком плиток:

      <md-grid-list md-cols-xs="2"
        md-cols-sm="3" md-cols-md="3" md-cols-gt-md="6"
        md-row-height="1:1" md-gutter="4px">

        <md-grid-tile class="saved-prop"
        ng-repeat="proforma in sdVm.pageGroups[sdVm.saved.idx]"
        ng-click="sdVm.showSelectedProperty(proforma); sdVm.linkToProperty(proforma)"
        ng-href="{{sdVm.path}}"
        ng-style="{'background-image':'url({{proforma.thumbnail_url}})'}">

          <pgo-saved-property proforma="proforma">
          </pgo-saved-property>
        </md-grid-tile>

      </md-grid-list>

Спасибо!