沒有任何想法這是如何工作的，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

回答

相關問題