angularjs中模型为空时如何隐藏下拉列表？

Question

我需要在模型为空时隐藏一个下拉列表，并在模型中有值时显示它。

1. 我有一个服务来获取值。

   angular.module('myApp.services', ['ngResource']) .factory('OptionsSelect', ['$resource', 功能（$资源）{ return $resource('http://myapi/miapp/optionselect/1', {}, { 询问： { 方法：'GET'， 参数：{ id：'1'}， 是数组：假 } }); } ])

2. 可能的结果是：

   {"1":"红色","5":"蓝色","34":"蓝色"}

或

<pre>
{}
</pre>

1. 在控制器中：

   $scope.optionsSelect = OptionsSelect.query();

2. 观点是：

   可以在jsfiddle中查看代码：http://jsfiddle.net/finsi/LMJXC/38/

Answer 1

您好，我为您创建了 jsbin，请看一下。您应该将模型添加到您的选择指令并使用 $promise ，如下所示。我希望这会有所帮助。

HTML：

 <div class="form-group" ng-show="optionsSelect">
    <select class="form-control" 
            ng-model="option.color"
            ng-options="key as value for (key, value) in optionsSelect">
 </div>

JS：

  app.controller('firstCtrl', function($scope, OptionsSelect){
    $scope.optionsSelect = {};

  OptionsSelect.query().$promise.then(function(optionSelectCollection){

    angular.copy(optionSelectCollection, $scope.optionsSelect);
  });




});

Answer 2

所以这些选择的 optionsSelect 对象是未定义的，如果没有返回任何内容，它们将保持未定义，如果 返回某些内容，它们将成为对象。如果它们未定义，您可以隐藏它们吗？比如在这个小提琴...http://jsfiddle.net/LMJXC/40/

<div class="form-group" ng-hide="optionsSelect === undefined">

和

<div class="form-group" ng-hide="optionsSelect2 === undefined">