Проблемы с минификацией HTML в AngularJS-проекте

Есть вот такой HTML:

<div class="footer">
    <div class="tools">
        <a role="button" class="material-button" href="{{item.url}}" target="_blank">
            <i class="icon fa fa-file-text"></i> Запись
        </a>
        <button type="button" class="material-button" ng-click="copyPost(item)">
            <i class="icon fa fa-clipboard"></i> Копировать
        </button> 
        <share url="{{item.url}}" title="{{item.source.name}}" description="{{item.text}}"></share>
    </div>
</div>

HTML-шаблон компонента Share:

<div class="share-block">
    <a class="material-button share vk" target="_blank" href="{{vk}}"><i class="fa fa-vk"></i></a>
    <a class="material-button share fb" target="_blank" href="{{fb}}"><i class="fa fa-facebook"></i></a>
    <a class="material-button share ok" target="_blank" href="{{ok}}"><i class="fa fa-odnoklassniki"></i></a>
    <a class="material-button share gp" target="_blank" href="{{gp}}"><i class="fa fa-google-plus"></i></a>
</div>

В браузере он выводится вот так:

После минификации HTML, он выглядит вот так:

На сколько я понял, это из за того, что при минификации были убраны пробелы. Я залез в сгенерированный минифицированный HTML, чтобы разобраться. В общем, к моему удивлению, между тегами <a> в компоненте share ЕСТЬ пробелы. Между тегом <a> и <button>, которые находятся в диве tools - НЕТ пробела.

Поясните мне, где здесь логика, как исправить ситуацию? Ведь по идее, там должен быть пробел, раз он есть в компоненте share между тегами <a>.

Grunt, grunt-angular-templates.