Bootstrap-Spalte funktioniert nicht wie erwartet

Question

Ich habe ein Bootstrap-Div mit 3 Spalten wie in der HTML unten angegeben und wenn ich ein Steuerelement in der ersten div der Zeile auswählen, werden die restlichen divs nicht angezeigt. aber wenn ich das gleiche aussage und mit Hallo Welttext überprüfe. Alle Spalten erscheinen genau so, wie es sein sollte.

Ich bin mir nicht sicher, was ich vermisse, und halte Ausschau nach einer neuen Reihe von Augen, um aufzuzeigen, was falsch ist. :)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"></script> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> 
 
<div class="container-fluid"> 
 
    <div style="text-align:center"> 
 
    <h1>Wind Monitoring System </h1> 
 
    </div> 
 
    <div class="row"> 
 
    <div class="col-md-4" style="background:blue"> 
 
     <span>Hello World1</span> 
 
     <!--<div> 
 
        <select id="states" ng-model="selectedState" ng-change="getCities()" size="3" ng-options="state.Name for state in states" /> 
 
       </div>--> 
 
    </div> 
 
    <div class="col-md-4" style="background:blue"> 
 
     <span>Hello World2</span> 
 
    </div> 
 
    <div class="col-md-4" style="background:blue"> 
 
     <span>Hello World3</span> 
 
     <!--<select id="city" ng-show="selectedState != null" ng-model="selectedCity" size="3" style="height:200px;width:200px" ng-options="city.city for city in cities | filter : {State:selectedState.Name}" />--> 
 
    </div> 
 
    </div> 
 
</div>

Answer 1

Wenn mich nicht alles täuscht die Auswahl Tags als solche <select></select> sein sollte, ich glaube, Sie sollen Ihre Optionen nicht Ihre <select> Tags verbindlich.

Check this link out

Okay, hier gehen Sie

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"></script> 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js"></script> 

<div ng-app="app"> 
<div class="container-fluid"> 
    <div style="text-align:center"> 
    <h1>Wind Monitoring System </h1> 
    </div> 
    <div class="row"> 
    <div class="col-md-4" style="background:blue"> 
     <span>Hello World1</span> 
     <div ng-controller="Test"> 
      <select ng-model="selectedState" size="3" ng-options="item for item in items"></select> 
     </div> 
    </div> 
    <div class="col-md-4" style="background:blue"> 
     <span>Hello World2</span> 
    </div> 
    <div class="col-md-4" style="background:blue"> 
     <span>Hello World3</span> 
    </div> 
    </div> 
</div> 
</div> 

JavaScript

var app = angular.module('app',[]); 
app.controller('Test',function($scope){ 
    $scope.items = ['one','two','three','four'] 
}); 

ich alles, was ich glaube, di d wurde das schließende Tag hinzugefügt.