许多AngularUI日期选择器使页面性能低下



我正在使用AngularUI Datepicker。我有seprate部分视图,每个视图都有ng个重复。我在那里使用AngularUIBootstrapDatepickers,这使得页面加载非常慢。

我遵循这个答案:页面上的许多UI Bootstrap Datepicker加载非常缓慢——我可以使用单个实例并移动元素吗?

但我很少遇到其他问题。在这种方法中,我们使用单独的ng-if从跨度切换到文本框。但在它们之间切换需要相当长的时间,这使得用户可以看到我们在玩文本框。(检查图像https://i.stack.imgur.com/YxZXQ.png)

我也遵循了这一点:https://github.com/angular-ui/bootstrap/pull/3666/commits

但我无法集成更改并成功运行日期选择器。

这个问题有可靠的解决方案吗?

页面上的许多UI Bootstrap Datepickers加载非常缓慢-我可以使用单个实例并移动元素吗?

   <p class="input-group">
    <span class="form-control" ng-if="!date.opened1">{{date.data1|date:format}}</span>
    <input type="text" class="form-control"
           ng-if="date.opened1" datepicker-popup="{{format}}" ng-model="date.data1"
           is-open="date.opened1"
           datepicker-options="dateOptions"
           close-text="Close"/>
        <span class="input-group-btn">
            <button type="button" class="btn btn-default" ng-click="open($event, date,1)">
                <i class="glyphicon glyphicon-calendar"></i>
            </button>
        </span>
</p>

代码

$scope.open = function($event,date,i) {
    $event.preventDefault();
    $event.stopPropagation();
    date['opened'+i] = !date['opened'+i];
 };

Plunkr链接

最新更新