Question

렌더링되는 항목이 "현재 항목"인 경우에만 표시되도록 템플릿의 일부 내용을 설정하려고합니다.

코드는 지금까지 렌더링 된 데이터 항목이 ID == window.viewModel.activeObject 인 경우에만 내부 템플릿의 일부만 렌더링 할 수 있기를 원합니다.

<section data-bind='template: { name: "categoryTemplate", foreach: categories }'></section> 

<script type="text/html" id="categoryTemplate"> 
    <section> 
     <h2>${Name}</h2> 
     <section data-bind='template: { name: "objectTemplate", foreach: Objects }'></section> 
    </section> 
</script> 
<script type="text/html" id="objectTemplate"> 
    <article> 
     <h3>${Name}</h3> 

     (only render this if the object rendered has ID equal to viewModel.activeObject) 
     {{html Text}} 

    </article> 
</script> 
<script> 
    $(document).ready(function(){ 
     window.viewModel = { categories : <asp:Literal runat="server" ID="LiteralJSON" />, 
      activeCategory: ko.observable(0), 
      activeObject: ko.observable(0) 
     }; 

     ko.applyBindings(window.viewModel); 
    }); 
</script> 

어떻게해야합니까?

Answer 1

사용할 수 있습니다 {if}{/if}

<script type="text/html" id="objectTemplate"> 
    <article> 
     <h3>${Name}</h3> 
     {if $item.data.id === viewModel.activeObject()} 
     {{html Text}} 
     {/if} 
    </article> 
</script>