我怎樣才能讓我的HTML控件通過引導

Question

我儘量讓我的html頁面的一些美化有組織的。我的代碼如下所示：

  <div class="row" ng-if="model.FieldType == customTypes.Select"> 
         <div class="form-group"> 
          <label class="control-label col-md-4">Seçim</label> 
          <div class="col-md-5"> 
            <input type="text" class="form-control" ng-model="model.NewComboItemForSelect" /> 
           </div> 
           <div class="col-md-5"> 
            <button type="button" class="btn btn-success" ng-click="AddToDropDownList()">+</button> 
            </div> 
          <div class="col-md-5"> 
           <select class="form-control" ng-options="field.id as field.value for field in DropdownListCustomItems" ng-model="model.DropdownListCustomItem"></select> 
           </div> 
          </div> 
         </div> 

，反而會導致這樣的;

我真的徘徊如何我可以將我的html控件移動到美麗的地方。請看紅色箭頭

Answer 1

Reference

使用下面的代碼

<div class="row" ng-if="model.FieldType == customTypes.Select"> 
<div class="form-group col-md-12"> 
    <label class="control-label col-md-4">Seçim</label> 
    <div class=" input-group col-md-8"> 
     <input type="text" class="form-control" ng-model="model.NewComboItemForSelect" /> 
     <div class="input-group-btn"> 
      <button type="button" class="btn btn-success" ng-click="AddToDropDownList()">+</button> 
     </div> 
    </div> 
</div> 
<div class="form-group col-md-6"> 
    <div class="col-md-5"> 
     <select class="form-control" ng-options="field.id as field.value for field in DropdownListCustomItems" ng-model="model.DropdownListCustomItem"></select> 
    </div> 
</div> 

Demo