1

我试图在我的角度项目中复制这个自动完成

http://plnkr.co/edit/t1neIS?p=preview

我将 HTML 和控制器数据复制到我的项目中,它的行为就像 Plunker 一样。接下来,我想尝试将 HTTP 服务指向我的自定义端点,因此我创建了一个 url,它返回与 Plunker 示例中完全相同的数据结构和标头,但自动完成功能不起作用。

来自 Plunker 示例的原始控制器代码:

$scope.cities = function(cityName) {
  return $http.jsonp("http://gd.geobytes.com/AutoCompleteCity?callback=JSON_CALLBACK &filter=US&q="+cityName).then(function(response){
    return limitToFilter(response.data, 15);
  });
};

我的版本:

$scope.cities = function(cityName) {
  return $http.jsonp("http://localhost/shfofx/PHP/Rest/symbols.php?keyword="+cityName).then(function(response){
    return limitToFilter(response.data, 15);
  });
};

从 plunker 示例返回的数据集(浏览器中的 URL):

JSON_CALLBACK([
  "San Acacia, NM, United States",
  "San Andreas, CA, United States",
  "San Angelo, TX, United States",
  .....
])

从我的端点返回的数据集(浏览器中的 URL):

JSON_CALLBACK([
  "GOOD",
  "GOODN",
  "GOODO",
  ......
])

来自 Plunker 示例的标头信息:

Content-Length →671
Content-type →application/javascript
Date →Sat, 19 Oct 2013 02:43:22 GMT
Expires →0
Server →Microsoft-IIS/6.0
X-Powered-By →ASP.NET

来自我的端点的标头信息:

Connection →Keep-Alive
Content-Length →58
Content-Type →application/javascript
Date →Sat, 19 Oct 2013 02:44:30 GMT
Keep-Alive →timeout=5, max=100
Server →Apache/2.2.23 (Unix) mod_ssl/2.2.23 OpenSSL/0.9.8x DAV/2 PHP/5.4.10
X-Powered-By →PHP/5.4.10

Plunker 示例中的端点按需要工作(请参阅上面的 plunker)。当我将 URL 指向我的端点时,根据 Chromes 资源检查器检索资源,但值不显示为自动完成选项?我可以做什么或尝试什么?

经过进一步审查,Chrome 资源检查器显示工作数据响应的前缀为:

angular.callbacks._2 (the 2 indicating that this is the 3rd call)

对于我的端点,“JSON_CALLBACK”没有被替换。

我可以明确地将返回的字符串设置为包含“angular.callbacks._$”,其中 $ 替换为尝试的次数并且它可以工作,但当然这不是正确的方法。任何帮助表示赞赏。

4

1 回答 1

1

所以答案是两部分:

1 - 我需要在请求中传递 callback=JSON_CALLBACK :

http://localhost/shfofx/PHP/Rest/symbols.php?callback=JSON_CALLBACK&keyword="+cityName)

2 - 然后在我的端点中,我需要提取回调参数并将其添加到返回响应的开头:

$row .= $callback;
$row .= $formattedResponse;
......
print $row;
于 2013-10-19T04:16:42.870 回答