Question

我正在使用此代码，

<script>
  autocompleteRemote = new Backbone.AutocompleteList({
    url: function() { return 'http://ws.audioscrobbler.com/2.0/?method=artist.search&api_key=cef6d600c717ecadfbe965380c9bac8b&format=json&' + $.param({ artist: $('form#autocomplete-remote input[name=search]').val() }); },
    filter: null,
    el: $('form#autocomplete-remote input[name=search]'),
    template: _.template('<p><%= name.replace(new RegExp("(" + $("form#autocomplete-remote input[name=search]").val() + ")", "i") ,"<b>$1</b>") %></p>'),
    delay: 500,
    minLength: 3,
    value: function(model) { return model.get('name') },
  }).resultsView.collection.parse = function(resp) {
    return resp.results.artistmatches.artist;
  };
</script>

但是我试图将它连接到tmdb api，就像这样，

autocompleteRemote = new Backbone.AutocompleteList({
  url: function() {
    return 'http://api.themoviedb.org/3/search/movie?api_key=' + api + '&' + $.param({query: $('form#autocomplete-remote input[name=search]').val()})
  },

  filter: null,

  el: $('form#autocomplete-remote input[name=search]'),
  template: _.template(
    '<p><%= name.replace(new RegExp("(" + $("form#autocomplete-remote input[name=search]").val() + ")", "i") ,"<b>$1</b>") %></p>'
  ),
  delay: 500,
  minLength: 3,
  value: function(model) { return model.get('name') }
  ,

  })

  .resultsView.collection.parse = function(resp) {
    return resp.results.moviematches.query;
  };

  var api = 'a8f7039633f206xx42cd8a28d7cadad4'

正如您所看到的，我更改了一些内容，例如url，并将api键放在var中以清理代码。我还将artist更改为query，因此它会返回正确的网址。但我在控制台日志中收到错误，而且我正在绘制一个空白。

Uncaught TypeError: Cannot read property 'query' of undefined
Backbone.AutocompleteList.resultsView.collection.parse 
.extend.set
options.success
fire
self.fireWith
done
callback

源材料可以在这里找到 - ＆gt; http://aghull.github.io/coding/2013/03/09/Backbone-autocomplete-lists/使用远程集合自动完成

Answer 1

Here是一个很好的资源，有助于找出响应主体。正如我从那里生成的测试响应中看到的那样，没有moviematches属性。你需要resp.results，它只是一个对象的集合（数组）（我想是电影）。

因此您需要将代码更改为：

var api = 'a8f7039633f206xx42cd8a28d7cadad4';

autocompleteRemote = new Backbone.AutocompleteList({
  url: function() {
    return 'http://api.themoviedb.org/3/search/movie?api_key=' + api + '&' + $.param({query: $('form#autocomplete-remote input[name=search]').val()})
  },

  filter: null,

  el: $('form#autocomplete-remote input[name=search]'),
  template: _.template(
    '<p><%= name.replace(new RegExp("(" + $("form#autocomplete-remote input[name=search]").val() + ")", "i") ,"<b>$1</b>") %></p>'
  ),
  delay: 500,
  minLength: 3,
  value: function(model) { return model.get('name') }
  ,

  }).resultsView.collection.parse = function(resp) {
    return resp.results;
  };

我试着发表评论，但它成了答案：）

修改

使用此fiddle进行测试。放置正确的API_KEY，然后重试。我已尝试使用您现有的api_key，但它无效。

骨干未捕获的TypeError

1 个答案: