bind.html

<script type="text/html" id="base-report-template">
    <div class="loading" data-bind="visible: visibleCondition"></div>
    <h2 data-bind="text: title"></h2>
    <div data-bind="template: { name: 'error-template' }, visible: iteratedCollection.length === 0"></div>
    <div data-bind="visibility: !visibleCondition && iteratedCollection.length > 0">

        <div class="span12" data-bind="css: { 'plot-wrapper': wrap }, style: { height: wrap ? height : 'auto' }">
            <table class="table table-hover">
                <thead>
                    <tr>
                        <th data-bind="text: nameHeader"></th>
                        <th data-bind="text: valueHeader"></th>
                    </tr>
                </thead>
                <tbody data-bind="foreach: iteratedCollection">
                    <tr>
                        <td data-bind="text: name"></td>
                        <td data-bind="text: formatter ? formatter(quantity, 0) : quantity"></td>
                    </tr>
                </tbody>
            </table>
        </div>
    </div>
</script>