parser error in html-minifier because of angular expression

Question

I am using gulp-htmlmin thats a wrapper around html-minifier. html-minifier can't parse this angular code.

<div class="col-md-4 text-center">
        <span ng-if="pagination.skip + pagination.take < totalCount || pagination.skip > 0">
        Viser {{ pagination.skip + 1 }}-{{ totalCount < pagination.skip + pagination.take ? totalCount : pagination.skip + pagination.take }} af {{ totalCount }} linjer
        </span>
    </div>

Its the text in the span that causes the error.

[19:00:34] Error in plugin 'gulp-htmlmin'
Message:
    Parse Error: < pagination.skip + pagination.take ? totalCount : pagination.skip + pagination.take }} af {{ totalCount }} linjer"
        </span>
    </div>

    <div class="col-md-4">
        <button class="btn btn-primary btn-sm pull-right" data-ng-show="pagination.skip + pagination.take < totalCount" data-ng-click="more()">
            Næste <i class="glyphicon glyphicon-chevron-right small"></i>
        </button>
    </div>
</div>
Details:
    fileName: C:\os2kitos\b1\kitos.web\src\app\shared\paginationButtons\paginationButtons.view.html
    domainEmitter: [object Object]
    domain: [object Object]
    domainThrown: false

Is there another way to write the text in the span?

Viser {{ pagination.skip + 1 }}-{{ totalCount < pagination.skip + pagination.take ? totalCount : pagination.skip + pagination.take }} af {{ totalCount }} linjer

I solved this by moving the logic to the controller as @Arun Ghosh suggested.

Answer 1

Try adding ignoreCustomFragments as a parameter to ignore expressions inside the handlebars:

htmlmin({
    ignoreCustomFragments: [ /\{\{[\s\S]*?\}\}/ ]
})