ui-select 未在动画中显示 div

Question

In this punk 我在从顶部滑动的 div 中有一个 ui-select（ui-select 接受多个项目）。问题是它没有显示。有什么解决办法吗？

Javascript

var app = angular.module("app", ['ngSanitize','ngAnimate']);

app.controller('ctl', function($scope) {
  $scope.tags = ['Red','Green','Blue','Maroon','Umbra','Turquoise'];
  $scope.multiple = {};
  $scope.multiple.tags = ['Blue','Red'];
});

HTML

Open <input type="checkbox" ng-click="opened=!opened">

<div class="panel" ng-show="opened">
    <ui-select multiple ng-model="multiple.tags" style="width:200px;height:30px">
        <ui-select-match>{{$item}}</ui-select-match>
        <ui-select-choices repeat="tag in tags | filter:$select.search">
          {{tag}}
        </ui-select-choices>
    </ui-select>
</div>

CSS

.panel{
position: fixed;
right: 20px;
top: -2px;
width:400px;
height:300px;
background-color:orange;
}
.panel.ng-hide {
  top: -300px;
}
.panel.ng-hide-add, .panel.ng-hide-remove {
  transition: 0s linear all;
}
.panel.ng-hide-add-active, .panel.ng-hide-remove-active {
transition: all ease-in-out 0.5s;
}
.panel.ng-show-add-active {
  display: block;
}

Answer 1

在您的 ui-select 元素上添加 tagging（指令）属性，这将显示您选择的字符串选项。

<ui-select multiple ng-model="multiple.tags" tagging style="width:200px;height:30px">
  <ui-select-match>{{$item}}</ui-select-match>
  <ui-select-choices repeat="tag in tags | filter:$select.search">
    {{tag}}
  </ui-select-choices>
</ui-select>

Forked Plunkr

ui-select 未在动画中显示 div

ui-select not showing in animated div

angularjs

ui-select