没有任何想法这是如何工作的，KnockOutJS

-3

我想编辑网站中的东西，但我无法正确理解。我此行没有任何想法这是如何工作的，KnockOutJS

{{ Hooks::renderHtml('Titles.Index.ForEachMovie') }}

什么，我想不出什么Titles.Index.ForEachMovie是。这呈现了一个电影列表，我想过滤这个列表，只显示其中的一部分。

来源

2016-09-20 Ibucalmin

什么是您的数据绑定属性看起来像？到目前为止，这看起来不像是knockouJS – FailedUnitTest

data-bind =“foreach：{data：sourceItems，afterRender：lazyLoadImage}” – Ibucalmin

您必须在JavaScript模型中过滤sourceItems，最有可能的方法是使用knockoutJS计算函数http：/ /knockoutjs.com/documentation/computedObservables.html。我也喜欢用underscoreJS来帮助过滤，它可以在1行中完成。 – FailedUnitTest

'Titles.Index.ForEachMovie'是来自我假设的后端列表。

现在可以说'Titles.Index.ForEachMovie'就是这样。

<script type="text/javascript"> 
    ko.applyBindings({ 
     Titles.Index.ForEachMovie: [ 
      { movieName: 'Titanic', movieId: 1}, 
      { movieName: 'The Secret life of Pets',movieId: 2 }, 
      { movieName: 'The guardian',movieId: 3 } 
     ] 
    }); 
</script>

所有你要做的就是通过这个列表使用迭代“看得见”的结合：

<table> 
    <thead> 
     <tr> 
      <th>Movie Name</th> 
     </tr> 
    </thead> 
    <tbody data-bind="foreach: Titles.Index.ForEachMovie"> 
     <tr> 

      <td data-bind="text: movieName",visible: movieId() == 2></td> 
     </tr> 
    </tbody> 
</table>

，或者你可以做这样的事情：

<table> 
     <thead> 
      <tr> 
       <th>Movie Name</th> 
      </tr> 
     </thead> 
     <tbody data-bind="foreach: Titles.Index.ForEachMovie"> 
      <tr> 
      <!-- ko if:movieId() == 2 --> 
       <td data-bind="text: movieName"></td> 
      <!-- /ko --> 
      </tr> 
     </tbody> 
    </table>

来源

2016-09-29 11:49:20

没有任何想法这是如何工作的，KnockOutJS

回答

相关问题