Angular2 - display data into 2 column

Angular2 2 columns

*ngFor를 사용하여 데이터를 2열로 보여주고 싶을 때가 있다.
(css framework는 clarity를 사용했다.)
코드는 다음과 같다.

<div *ngFor="let product of _products;">
    <div *ngFor="let feature of product.features; let i=index;">
        <div class="row">
            <div class="checkbox col-md-6" *ngIf="product.features[i]">
                <input type="checkbox" 
                       id="product.features[i].displayName" 
                       [checked]="product.features[i].isChecked">
                <label for="product.features[i].displayName">
                    {{ product.features[i].displayName }}
                </label>
            </div>
            <div class="checkbox col-md-6" *ngIf="product.features[i+1]">
                <input type="checkbox" 
                       id="product.features[i+1].displayName" 
                       [checked]="product.features[i+1].isChecked">
                <label for="product.features[i+1].displayName">
                    {{ product.features[i+1].displayName }}
                </label>
            </div>
        </div>
    </div>
</div>

위의 코드를 실행시킨 화면이다.