Question

我正在努力学习Ember，并试图用它做一些小想法。目前，我正在尝试接收文本字段输入以过滤列表并返回匹配结果。我知道所有这些都是“硬”的东西。但是，没有工作的部分是Handlebars读取我返回的数组的'title'属性。它只是空白。

这是我的模板：

<script data-template-name="application" type="text/x-handlebars">
  {{input type="text" value=searchString placeholder="Search..."}}
  {{filterMovies}}
  <ul>
    {{#each searchResults}}
    <li>{{title}}</li>
    {{/each}}
  </ul>
</script>

现在我的控制器：

    App.ApplicationController = Ember.Controller.extend({
    filterMovies: function() {
      var self = this,
        searchString = self.get('searchString'),
        searchResults = [],
        filterArrLength = null,
        theFullMovieList,
        theFilteredMovieList = [];

      if (!searchString) {
        return;
      }

      var url = 'http://www.json-generator.com/api/json/get/clVKyWQSnC';
      Ember.$.getJSON(url).then(function(data) {
        theFullMovieList = data;

        theFullMovieList.filter(function(movie) {
          if (movie.title.toLowerCase().startsWith(searchString)) {
            theFilteredMovieList.push(movie);
          }
        });
        console.log(theFilteredMovieList);
        self.set('searchResults', theFilteredMovieList);
      });
    }.property('searchString')
  });

我尝试使用{{this}}，{{this.title}}，{{searchResults.title}}和{{title}}进行打印但没有运气。但是，记录数组会显示正确的值。

有什么想法吗？ View On CodePen

Answer 1

您的每种语法都无效。您必须使用新语法：

<ul>
  {{#each searchResults as |movie|}}
    <li>{{movie.title}}</li>
  {{/each}}
</ul>

See working demo on CodePen.

Ember和Handlebars迭代一组数组

1 个答案: