부트 스트랩 입력 그룹이 그룹화되지 않음

Question

input-group을 사용하여이 두 div를 그룹화하여 첫 번째 항목이 드롭 다운으로 선택되도록하려고합니다. 내가 그 부트 스트랩 여기의 선택 내부를 사용하여 작동하지 않습니다 들었습니다

지금처럼

는 무엇인가하는 것은 보인다. 여기가 가능합니까?

첫 번째 사진과 같이 서로 옆에있는 두 개를 어떻게 얻을 수 있습니까?

P. 구조 만 봐주세요, 독점적이기 때문에 물건의 이름을 삭제합니다.

감사합니다.

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/> 
 
<div class="input-group"> 
 
    <div class="col-md-4 col-sm-3" ng-init="vm.Current = vm.interval"> 
 
    <select class="form-control" ng-model="vm.Current" ng-options="interval.set for interval in vm.intervals"></select> 
 
    </div> 
 
    <ng-form name="intervalsForm"> 
 
    <div class="col-md-5 col-sm-9" ng-repeat="interval in vm.intervals" ng-show="vm.Current == interval"> 
 
     <ng-form name="singleForm"> 
 
     <input type="text" class="form-control" placeholder="HH:mm:ss" name="single" id="interval" ng-model="vm.Interval" ng-pattern="/^\d{2}:\d{2}:\d{2}$/" ng-class="{inputError: single.interval.$error.pattern && intervalForm.interval.$dirty || single.interval.$invalid || vm.settings.$submitted && intervalForm.interval.$invalid}" required/> 
 
     </ng-form> 
 
    </div> 
 
    </ng-form> 
 
    <span class="input-error-span" ng-show="(intervalsForm.$dirty || intervalsForm.$invalid) && intervalsForm.$invalid">{{ vm.validationMessages.intervalHHmm }}:ss</span> 
 
</div>

Answer 1

당신은 아래와 같이이 작업을 수행 할 수 있습니다 : 그것은 다음과 같습니다 귀하의 코드를 사용자 정의 할 수

.form-control .form-control { 
 
    border:0; 
 
}

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/> 
 

 
<div class="input-group"> 
 
    <span class="input-group-addon"> 
 
    <select></select> 
 
    </span> 
 
    <input type="text" class="form-control"> 
 
</div>

시도합니다.