Question

从上图。使用尚未隐藏的角度代码可以看到我的代答时间和下降时间。我已经在标签上添加了ng-cloak，但仍然显示相同的内容。

我的观点

<label for="">Pick-up Time</label>
            <select class="selectpicker form-control dropdown-itinerary" ng-model="ItineraryDetails.PickUpTime">
                    <option ng-repeat="Time in TimeIntervals track by $index" class="ng-cloak"><% Time %></option>
            </select>
        </div>

控制器

// DropDown selector for time data
$scope.TimeIntervals = ['00:00','00:30','01:00','01:30','02:00','02:30','03:00','03:30'
     ,'04:00','04:30','05:00','05:30','06:00','06:30','07:00','07:30'
     ,'08:00','08:30','09:00','09:30','10:00','10:30','11:00','11:30'
     ,'12:00','12:30','13:00','13:30','14:00','14:30','15:00','15:30'
     ,'16:00','16:30','17:00','17:30','18:00','18:30','19:00','19:30'
     ,'20:00','20:30','21:00','21:30','22:00','22:30','23:00','23:30'];

Answer 1

Plunker：http://plnkr.co/edit/jk0jHEjCVrkdfLm4XHuq?p=preview

HTML：

<body ng-controller="MainCtrl">
  <label for="">Pick-up Time</label>
  <select class="selectpicker form-control dropdown-itinerary"
          ng-model="ItineraryDetails.PickUpTime"
          ng-options="Time for Time in TimeIntervals">
  </select>
</body>

的JavaScript / AngularJS：

app.controller('MainCtrl', function($scope) {
  $scope.TimeIntervals = ['00:00', '00:30', '01:00', '01:30', '02:00', '02:30', '03:00', '03:30', '04:00', '04:30', '05:00', '05:30', '06:00', '06:30', '07:00', '07:30', '08:00', '08:30', '09:00', '09:30', '10:00', '10:30', '11:00', '11:30', '12:00', '12:30', '13:00', '13:30', '14:00', '14:30', '15:00', '15:30', '16:00', '16:30', '17:00', '17:30', '18:00', '18:30', '19:00', '19:30', '20:00', '20:30', '21:00', '21:30', '22:00', '22:30', '23:00', '23:30'];
});

Answer 2

你将在html上使用ng-options，更简单：

HTML：

<label for="">Pick-up Time</label>
        <select class="selectpicker form-control dropdown-itinerary" ng-model="ItineraryDetails.PickUpTime" ng-options="time as time for time in TimeIntervals track by $index">
        </select>

如何在角落中的下拉列表中隐藏选择

2 个答案: