AngularJs + Bootstrap + Typehead + Ajax仅在我放置警报框但仅在Chrome中有效

Question

我在此链接http://angular-ui.github.io/bootstrap/上使用的angularjs使用bootsrap字体

在我的控制器中

 $scope.getUser = function(val) {
        //alert("hi");
         return $http.get('user/getUserNames.do', {
              params: {
                userName: val,

              }
            }).then(function(response){

              return response.data;


            });


          };

我的html代码

<input type="text" ng-model="asyncSelected"  typeahead-wait-ms="300" typeahead="user for user in getUser($viewValue)"  class="form-control">

如果删除警报，则打印头将无法工作

如果我保持警惕，打字头将仅适用于镀铬

如果我在“ return $ http.get（'user / getUserNames.do'”）处放置一个断点，并使用fire bug退出，它将在firefox中工作

我正在从服务器接收此格式['name1'，'name2']中的数据

有人请帮忙

提前致谢

Answer 1

多数民众赞成，因为收到关闭异步数据所需的时间。 您应该将数据存储在$ scope上，而不是在$ scope上调用函数

   $scope.users= {};
   $scope.getUser = function(val) {

     return $http.get('user/getUserNames.do', {
          params: {
            userName: val,

          }
        }).then(function(response){

          $scope.users=  response.data;


        });


      };

html

  <input type="text" ng-model="asyncSelected"  ng-change="getUser($viewValue)"
  typeahead-wait-ms="300" typeahead="user for user in users"  class="form-control">

Answer 2

您的鳕鱼逻辑不正确，您无法从异步函数中返回需要时间才能完成的数据，

不要从此getUser函数返回任何内容。 您有2个选择：

1-将responce.data存储在全局变量中以备后用

$scope.users = [];
$scope.getUser = function (val) {
    $http.get('user/getUserNames.do', {
        params: {
            userName: val
        }
    }).then(function (response) {
        $scope.users.push(response.data);
    });
};

2-在get函数完成后调用另一个函数来处理接收到的数据

$scope.getUser = function (val) {
    $http.get('user/getUserNames.do', {
        params: {
            userName: val
        }
    }).then(function (response) {
        $scope.userLoaded(response.data);
    });
};

Answer 3

通过angular-ui-bootstrap中的简单hack，我解决了问题

之前..........

 var getMatchesAsync = function(inputValue) {

        var locals = {$viewValue: inputValue};
        isLoadingSetter(originalScope, true);
        $q.when(parserResult.source(originalScope, locals)).then(function(matches) {

          //it might happen that several async queries were in progress if a user were typing fast
          //but we are interested only in responses that correspond to the current view value
          var onCurrentRequest = (inputValue === modelCtrl.$viewValue);
          if (onCurrentRequest && hasFocus) {
            if (matches.length > 0) {

              scope.activeIdx = focusFirst ? 0 : -1;
              scope.matches.length = 0;

              //transform labels
              for(var i=0; i<matches.length; i++) {
                locals[parserResult.itemName] = matches[i];
                scope.matches.push({
                  id: getMatchId(i),
                  label: parserResult.viewMapper(scope, locals),
                  model: matches[i]
                });
              }

              scope.query = inputValue;
              //position pop-up with matches - we need to re-calculate its position each time we are opening a window
              //with matches as a pop-up might be absolute-positioned and position of an input might have changed on a page
              //due to other elements being rendered
              scope.position = appendToBody ? $position.offset(element) : $position.position(element);
              scope.position.top = scope.position.top + element.prop('offsetHeight');

              element.attr('aria-expanded', true);
            } else {
              resetMatches();
            }
          }
          if (onCurrentRequest) {
            isLoadingSetter(originalScope, false);
          }
        }, function(){
          resetMatches();
          isLoadingSetter(originalScope, false);
        });
      };

我刚刚从代码中删除了“ && hasFocus”此sipneet

在........之后

var getMatchesAsync = function(inputValue) {

            var locals = {$viewValue: inputValue};
            isLoadingSetter(originalScope, true);
            $q.when(parserResult.source(originalScope, locals)).then(function(matches) {

              //it might happen that several async queries were in progress if a user were typing fast
              //but we are interested only in responses that correspond to the current view value
              var onCurrentRequest = (inputValue === modelCtrl.$viewValue);
              if (onCurrentRequest) {
                if (matches.length > 0) {

                  scope.activeIdx = focusFirst ? 0 : -1;
                  scope.matches.length = 0;

                  //transform labels
                  for(var i=0; i<matches.length; i++) {
                    locals[parserResult.itemName] = matches[i];
                    scope.matches.push({
                      id: getMatchId(i),
                      label: parserResult.viewMapper(scope, locals),
                      model: matches[i]
                    });
                  }

                  scope.query = inputValue;
                  //position pop-up with matches - we need to re-calculate its position each time we are opening a window
                  //with matches as a pop-up might be absolute-positioned and position of an input might have changed on a page
                  //due to other elements being rendered
                  scope.position = appendToBody ? $position.offset(element) : $position.position(element);
                  scope.position.top = scope.position.top + element.prop('offsetHeight');

                  element.attr('aria-expanded', true);
                } else {
                  resetMatches();
                }
              }
              if (onCurrentRequest) {
                isLoadingSetter(originalScope, false);
              }
            }, function(){
              resetMatches();
              isLoadingSetter(originalScope, false);
            });
          };