Question

我有一个这样的下拉菜单：

<select selectpicker name="SubArea" ng-model="search.SubArea" ng-options="SubArea.SubArea as (SubArea.SubArea + ' (' + SubArea.Count + ')') for SubArea in subareas | orderBy:'SubArea'" ng-multiple="true" multiple title="All Areas" data-size="auto" data-header="Select Areas" data-live-search="true" data-selected-text-format="count > 2">
    </select>

这是在控制器中：

$scope.subareas = {};

$http.get('subareas.php')
  .success(function(response) 
  {
    $scope.subareas = response;
  });

我也在使用这个bootstrap select指令：

angular.module('angular-bootstrap-select', [])
.directive('selectpicker',
    [
        '$timeout',
        function($timeout) {
            return {
                restrict: 'A',
                require: ['?ngModel'],
                compile: function(tElement, tAttrs) {
                    tElement.selectpicker();

                    if (angular.isUndefined(tAttrs.ngModel)) {
                        throw new Error('Please add ng-model attribute!');
                    } 

                    return function(scope, element, attrs, ngModel) {
                        if (angular.isUndefined(ngModel)){
                            return;
                        }

                        scope.$watch(attrs.ngModel, function(newVal, oldVal) {
                            if (newVal !== oldVal) {
                                $timeout(function() {
                                    element.selectpicker('val', element.val());
                                });
                            }
                        });                            

                        ngModel.$render = function() {
                            element.selectpicker('val', ngModel.$viewValue || '');
                        };

                        $timeout(function() {
                            element.selectpicker('refresh');

                            element.change(function() { 
                                if ($(this).val() !== '') {
                                    $('.form-search .bootstrap-select.open').addClass('selected-option-check');
                                }else {
                                    $('.form-search  .bootstrap-select.open').removeClass('selected-option-check');
                                }
                            });


                        },1000);


                        ngModel.$viewValue = element.val();
                    };
                }
            };
        }
    ]
);

我遇到的问题是，有时选择选项不会加载（似乎是在PC上使用较慢的互联网连接。

这有任何已知问题吗？

提前致谢

Answer 1

我有类似的问题。在数据加载后更改ng-model时解决了这个问题。

$scope.subareas = {};

$http.get('subareas.php')
  .success(function(response) 
  {
    $scope.subareas = response;
    $scope.SubArea = [];
  });

角度ng-options随机不加载

1 个答案: