2014-06-22 59 views
0

我试图隐藏或显示<select>标记,基于数组引用是否为[]<select>标记由相同的数组支持。ng-show不适用于<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> 

回答

3

空数组(一次分配)成为一个对象。似乎这个对象是总是真实(空或不)。

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> 
相关问题