ng-show不適用於<select>

Question

我試圖隱藏或顯示<select>標記，基於數組引用是否爲[]。 <select>標記由相同的數組支持。

<select ng-show="model.people" ng-model="model.selectedPerson" ng-options="person.name for person in model.people"></select> 

然而它不工作。 model.people最初是[]。

當添加第一個元素時，使用model.addPerson()，我希望model.people是真的，因此設置顯示爲真實值並最終顯示<select>標記。

JavaScript代碼：

angular.module('app', []) 
     .controller('FormController', function($scope) { 
      var model={}; 
      model.person=function(person){ 
       return{ 
         name:person.name, 
         age:person.age 
         }; 
      }; 
      model.people=[]; 
      model.addPerson=function(person){ 
       model.people.push(new model.person(person)); 
       if(model.people){ 
        console.log(true); 
       }else{ 
        console.log(false); 
       } 
      }; 
      model.selectedPerson=model.people[0]; 
      $scope.model=model; 
     }); 

HTML代碼：

<form name="form" ng-controller="FormController" ng-submit="model.addPerson(model.anyPerson)" novalidate> 
    <input type="text" ng-model="model.anyPerson.name" ng-required="true" placeholder="Name"/><br/> 
    <input type="number" name="age" ng-model="model.anyPerson.age" min="15" max="100" ng-required="true" placeholder="Age"/><br/> 
    <button type="submit" ng-disabled="form.$invalid">Add Person</button><br/> 
    <select ng-show="model.people" ng-model="model.selectedPerson" ng-options="person.name for person in model.people"></select><br/> 
    <span ng-show="model.selectedPerson" ng-bind-template="Name: {{model.selectedPerson.name}}, Age: {{model.selectedPerson.age}}"></span> 
</form> 

Answer 1

空數組（一次分配）成爲一個對象。似乎這個對象是總是真實（空或不）。

var empty = []; 
if (empty) { 1; } else { 2; } 

上面的代碼在我的測試中總是返回1。

因此，我建議你在ng-show改用length > 0：

<select ng-show="model.people.length > 0" ng-model="model.selectedPerson" ng-options="person.name for person in model.people"></select>