クリック後にHTMLドロップダウン要素が消えます

Angularのng-initを使用して残りの呼び出し関数を読み込み、$ scope.racesを満たしてからドロップダウンを埋めます。クリック後にHTMLドロップダウン要素が消えます

最初はすべて読み込みに問題はないようです。しかし、ドロップダウンメニューをクリックしてオプションを選択すると、ドロップダウンはすぐに空になります。

多分$ scope.racesが空になると仮定します。

これは私の角度コントローラです：

angular.module('MyApp', []) 
.controller('RestController', function($scope, $http) { 

    $scope.getRaces = function() { 
     $http.get('http://localhost:8080/races'). 
     success(function(data) { 
      $scope.races = data; 
     }); 
    } 
});

これはHTML：

<!doctype html> 
<html> 
<head> 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular.min.js"></script> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> 
<script src="restController.js"></script> 

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

<body ng-app="MyApp" ng-controller="RestController"> 
<div class="container-fluid" ng-init="getRaces()"> 
    <select ng-model="races"> 
     <option ng-repeat="race in races" value="{{race.raceId}}">{{race.raceName}}</option> 
    </select> 
</div> 
</body> 
</html>

出典

2016-07-11 brainmassage

$ scope.racesを書く上で、あなたの問題はあなたの選択のNG-モデルは= "レース" ですオプションを選択するとすぐにrestController.jsに保存されます。 ng-model = "race"をng-model = "racesSelection"のような名前に変更し、これを変数として使用して選択されたオプションを決定します。

出典

2016-07-11 17:15:51 otherstark

ng-model = "race"は、。ここにサンプルがあります。

<!doctype html> 
    <html> 
    <head> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular.min.js"></script> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
    <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> 
    <script src="restController.js"></script> 

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

    <body ng-app="MyApp" ng-controller="RestController"> 
    <div class="container-fluid" ng-init="getRaces()"> 
     <select> 
      <option ng-repeat="race in races" value="{{race.raceId}}">{{race.raceName}}</option> 
     </select> 
    </div> 
    <script> 
    angular.module('MyApp', []) 
    .controller('RestController', function($scope, $http) { 

     $scope.getRaces = function() { 
     var data = [{raceId:'1',raceName:'nam1'},{raceId:'12',raceName:'nam2'},{raceId:'13',raceName:'nam13'}];//get data from http 
     $scope.races = data; 
      // $http.get('http://localhost:8080/races'). 
      // success(function(data) { 
      //  $scope.races = data; 
      // }); 
     } 
    }); 
    </script> 
    </body> 
    </html>

出典

2016-07-11 17:19:51 Knitesh

クリック後にHTMLドロップダウン要素が消えます

答えて

関連する問題