ng-switch 不适用于 angular-ui typeahead答案

【问题标题】：ng-switch does not work with angular-ui typeaheadng-switch 不适用于 angular-ui typeahead
【发布时间】：2014-05-23 09:54:21
【问题描述】：

我正在使用 angular-ui typeahead 指令和 ng-switch。目的是在输入预输入框时，会出现以“人员信息”开头的行。否则，它不会出现。现在的问题是这行总是出现。

我在这里创建了一个 plunker。 http://plnkr.co/edit/qEaYE6BHjmMewmlheFoh

相关代码段如下； HTML;

<div class='container-fluid' ng-controller="TypeaheadCtrl">
        <h4>Static arrays</h4>
        <!-- <pre>Model: {{selected }}</pre>
        <pre>Model: {{selected.name}} {{selected.id}}</pre> -->
        <div ng-switch="selected.name">
            <div ng-switch-when="" > 
                <BR><BR>                
            </div>
            <div ng-switch-default >              
                <pre>Person info: {{selected.name}} {{selected.id}}</pre> 
            </div>
        </div> 

        <input type="text" ng-model="selected" 
               typeahead="person as person.name for person in person_info | filter:{name:$viewValue} | limitTo:8"                
               class="form-control">        
    </div>

Javascript 控制器：

var person_info =  [
                        {
                                "name": "Tom",
                                "id": "111"
                        },
                        {
                                "name": "Sam",
                                "id": "222"
                        },
                        {
                                "name": "James",
                                "id": "333"
                        }
                    ];
    $scope.person_info = person_info;

【问题讨论】：

标签： javascript angularjs angular-ui ng-switch angular-ui-typeahead

【解决方案1】：

你可以使用 ng-if/ng-show/ng-hide 来代替 ng-switch

这是一个带有 ng-if 的代码

 <div ng-if="selected.name == null" > 
      <BR><BR>                
 </div>
 <div ng-if="selected.name">              
      <pre>Person info: {{selected.name}} {{selected.id}}</pre> 
 </div>

只需用 ng-switch 替换它

【讨论】：