Angular 2:在新行上打印复选框标签

时间:2017-09-26 15:50:04

标签: angular

在此段代码中,复选框和标签未出现在正常的同一行。相反,复选框打印在一行上,标签打印在一个新行上。如何让两者在同一行上打印?

 <div class="col-xs-12">
<div class="col-xs-2 sidenav">      
  <form>
    <h4><b>Brand</b></h4>
    <div class="form-group">
      <div *ngFor="let brand of brands">
        <label>
        <input type="checkbox" name="brand.name" 
          [(ngModel)]="brand.checked" (change)="filterProducts()"
          class="form-control inpcheck"> {{brand.name}}
        </label>
      </div>
    </div>
  </form>
</div>

从控制台产生的html:

<div _ngcontent-c5="">
<label _ngcontent-c5="">
        <input _ngcontent-c5="" 
        class="form-control inpcheck ng-untouched ng-pristine ng-valid" 
        name="brand.name" type="checkbox" ng-reflect-name="brand.name" 
        ng-reflect-model="false"> Whirlpool
        </label>
  </div>
  <div _ngcontent-c5="">
<label _ngcontent-c5="">
        <input _ngcontent-c5="" 
        class="form-control inpcheck ng-untouched ng-pristine ng-valid" 
        name="brand.name" type="checkbox" ng-reflect-name="brand.name" 
        ng-reflect-model="false"> KitchenAid
        </label>
  </div>

0 个答案:

没有答案