Knockout错误:找到没有匹配开头注释的结尾注释，作为[object Text]的子级

Question

重新查看过去运行良好的一些代码时，我收到控制台错误发现结束注释没有匹配的开头注释，作为[object Text]的子级，但我的所有标记似乎都已关闭。

我删除了典型的HTML注释标签，认为验证过程不喜欢这些标签，但即使如此，我还是收到了错误。

我错过了什么？

<div id="CC-guidedNavigation-section">
<!-- ko if: guidedNavigationViewModel().displayWidget && displayRefineResults -->
<div class="row guided-nav-holder">
<!-- ko foreach: dimensionDisplay -->
<div class="dimension-holder row">
<span class="dimension-display-name" data-bind="text: $data.displayName"></span><br/>
<!-- ko ifnot: $data.singleSelect -->
<!-- ko foreach: $data.refinements -->
<!-- ko if: $data.imgSrc -->
<!-- ko if: $data.imgSrc.indexOf('|') == -1 -->
<div class = "mating-scenarios col-xs-6 col-md-3" data-bind="attr: {for: 'CC-guidedNavigation-refinementCheckboxValue-'+ $parentContext.$index() + '_' + $index()}">

<img data-bind="attr:{src: '/file/general/'+imgSrc, title: label ,id: 'CC-guidedNavigation-refinementCheckboxValue-'+ $parentContext.$index() + '_' + $index()}, click:function(data, event){ return $parents[1].updateSelection($data,$parent,$parentContext.$index(),event)}" alt="img" />
<label class="image-text-guided" data-bind="text: $data.label"></label>
</div>

<!-- /ko -->
<!-- /ko -->
<!-- ko ifnot: $data.imgSrc -->

<label data-bind="attr: {for: 'CC-guidedNavigation-refinementCheckboxValue-'+ $parentContext.$index() + '_' + $index()}">
<input type="checkbox" data-bind="attr: {id: 'CC-guidedNavigation-refinementCheckboxValue-'+ $parentContext.$index() + '_' + $index()}, click:function(data, event){ return $parents[1].updateSelection($data,$parent,$parentContext.$index(),event)}">
<span data-bind="text: $data.label"></span>
</label>

<!-- /ko -->
<!-- /ko -->
<!-- /ko -->

<!-- ko if: $data.singleSelect -->
<!-- ko foreach: $data.refinements-->
<label data-bind="attr: {for: 'CC-guidedNavigation-refinementCheckboxValue-'+ $parentContext.$index() + '_' + $index()}">
<input type="radio" data-bind="attr: {id: 'CC-guidedNavigation-refinementCheckboxValue-'+ $parentContext.$index() + '_' + $index(), name:'guided-nav-radio' + $parentContext.$index()}, click:function(data, event){ return $parents[1].updateSelection($data,$parent,$parentContext.$index(),event)}">
<span data-bind="text: $data.label"></span>
</label>

<!-- /ko -->
<!-- /ko -->
</div>
<!-- /ko -->
<div class="contactsRange col-md-5 splitFacets">
<span class="dimension-display-name">Number of Contacts (Range)</span>
<br/>
<label>
MIN <br/>
<input type="number" name="minContactsEntered" data-bind="textInput: $rawData.minContactsEntered, event:{blur: $rawData.updateRangeUrl}, disable: maxLengthEntered() || maxWidthEntered() || maxHeightEnteredInches()">
</label>
<label>
MAX <br/>
<input type="number" name="maxContactsEntered" data-bind="textInput: $rawData.maxContactsEntered, event:{blur: $rawData.updateRangeUrl}, disable: maxLengthEntered() || maxWidthEntered() || maxHeightEnteredInches()">
</label>
</div>
<div class="col-xs-12 col-md-2" style="padding-top: 60px; font-size: 1.2em">-or-</div>
<div class="col-md-5 splitFacets">
<div>


<label>
<span class="dimension-display-name">Length Max (Range)</span>
<br/>
<input type="number" name="maxLengthEntered" data-bind="textInput: $rawData.maxLengthEntered, event:{blur: $rawData.updateRangeUrl}, enable: !minContactsEntered() && !maxContactsEntered()">
<span>mm</span>&nbsp;&nbsp; <span data-bind="text: '('+$rawData.maxLengthEnteredInches()+' in.)'"></span>
</label>
</div>

<div class="">


<label>
<span class="dimension-display-name">Width Max (Range)</span>
<br/>

<input type="number" name="maxWidthEntered" data-bind="textInput: $rawData.maxWidthEntered, event:{blur: $rawData.updateRangeUrl}, enable: !minContactsEntered() && !maxContactsEntered()">
<span>mm</span>&nbsp;&nbsp; <span data-bind="text: '('+$rawData.maxWidthEnteredInches()+' in.)'"></span>
</label>
</div>
<div class=" remove-border">


<label>
<span class="dimension-display-name">Height Max (Range)</span>
<br/>
<input type="number" name="maxHeightEntered" data-bind="textInput: $rawData.maxHeightEntered, event:{blur: $rawData.updateRangeUrl},  enable: !minContactsEntered() && !maxContactsEntered()">
<span>mm</span>&nbsp;&nbsp; <span data-bind="text: '('+$rawData.maxHeightEnteredInches()+' in.)'"></span>
</label>
</div>
</div>
<!-- /ko -->  
</div> 
<div class="guided-nav-buttons col-xs-12">
<div class="col-xs-6 col-md-3">
<a href="#">
<button class="btn btn-primary filter-button" data-bind="click: findMatchingProducts">Find Matching Products</button>
</a>
</div>
<div class="col-xs-6 col-md-3">
<button class="btn btn-secondary reset-button" data-bind="click : clearRefinement()">Reset All Values</button>
</div>
</div>
<!-- /ko -->       
</div>```
Any help you can provide is greatly appreciated!

Answer 1

根据缩进，我认为这是不需要的结束标记：

<!-- ko if: guidedNavigationViewModel().displayWidget && displayRefineResults -->
<div class="row guided-nav-holder">
<!-- ko foreach: dimensionDisplay -->
<div class="dimension-holder row">
<span class="dimension-display-name" data-bind="text: $data.displayName"></span><br/>
<!-- ko ifnot: $data.singleSelect -->
<!-- ko foreach: $data.refinements -->
<!-- ko if: $data.imgSrc -->
<!-- ko if: $data.imgSrc.indexOf('|') == -1 -->
<div class = "mating-scenarios col-xs-6 col-md-3" data-bind="attr: {for: 'CC-guidedNavigation-refinementCheckboxValue-'+ $parentContext.$index() + '_' + $index()}">

<img data-bind="attr:{src: '/file/general/'+imgSrc, title: label ,id: 'CC-guidedNavigation-refinementCheckboxValue-'+ $parentContext.$index() + '_' + $index()}, click:function(data, event){ return $parents[1].updateSelection($data,$parent,$parentContext.$index(),event)}" alt="img" />
<label class="image-text-guided" data-bind="text: $data.label"></label>
</div>

<!-- /ko -->
<!-- /ko -->
<!-- ko ifnot: $data.imgSrc -->

<label data-bind="attr: {for: 'CC-guidedNavigation-refinementCheckboxValue-'+ $parentContext.$index() + '_' + $index()}">
<input type="checkbox" data-bind="attr: {id: 'CC-guidedNavigation-refinementCheckboxValue-'+ $parentContext.$index() + '_' + $index()}, click:function(data, event){ return $parents[1].updateSelection($data,$parent,$parentContext.$index(),event)}">
<span data-bind="text: $data.label"></span>
</label>

<!-- /ko -->
<!-- /ko -->
<!-- /ko -->

<!-- ko if: $data.singleSelect -->
<!-- ko foreach: $data.refinements-->
<label data-bind="attr: {for: 'CC-guidedNavigation-refinementCheckboxValue-'+ $parentContext.$index() + '_' + $index()}">
<input type="radio" data-bind="attr: {id: 'CC-guidedNavigation-refinementCheckboxValue-'+ $parentContext.$index() + '_' + $index(), name:'guided-nav-radio' + $parentContext.$index()}, click:function(data, event){ return $parents[1].updateSelection($data,$parent,$parentContext.$index(),event)}">
<span data-bind="text: $data.label"></span>
</label>

<!-- /ko -->
<!-- /ko -->
</div>
========>   <!-- /ko -->
<div class="contactsRange col-md-5 splitFacets">
<span class="dimension-display-name">Number of Contacts (Range)</span>
<br/>
<label>
MIN <br/>
<input type="number" name="minContactsEntered" data-bind="textInput: $rawData.minContactsEntered, event:{blur: $rawData.updateRangeUrl}, disable: maxLengthEntered() || maxWidthEntered() || maxHeightEnteredInches()">
</label>
<label>
MAX <br/>
<input type="number" name="maxContactsEntered" data-bind="textInput: $rawData.maxContactsEntered, event:{blur: $rawData.updateRangeUrl}, disable: maxLengthEntered() || maxWidthEntered() || maxHeightEnteredInches()">
</label>
</div>
<div class="col-xs-12 col-md-2" style="padding-top: 60px; font-size: 1.2em">-or-</div>
<div class="col-md-5 splitFacets">
<div>


<label>
<span class="dimension-display-name">Length Max (Range)</span>
<br/>
<input type="number" name="maxLengthEntered" data-bind="textInput: $rawData.maxLengthEntered, event:{blur: $rawData.updateRangeUrl}, enable: !minContactsEntered() && !maxContactsEntered()">
<span>mm</span>&nbsp;&nbsp; <span data-bind="text: '('+$rawData.maxLengthEnteredInches()+' in.)'"></span>
</label>
</div>

<div class="">


<label>
<span class="dimension-display-name">Width Max (Range)</span>
<br/>

<input type="number" name="maxWidthEntered" data-bind="textInput: $rawData.maxWidthEntered, event:{blur: $rawData.updateRangeUrl}, enable: !minContactsEntered() && !maxContactsEntered()">
<span>mm</span>&nbsp;&nbsp; <span data-bind="text: '('+$rawData.maxWidthEnteredInches()+' in.)'"></span>
</label>
</div>
<div class=" remove-border">


<label>
<span class="dimension-display-name">Height Max (Range)</span>
<br/>
<input type="number" name="maxHeightEntered" data-bind="textInput: $rawData.maxHeightEntered, event:{blur: $rawData.updateRangeUrl},  enable: !minContactsEntered() && !maxContactsEntered()">
<span>mm</span>&nbsp;&nbsp; <span data-bind="text: '('+$rawData.maxHeightEnteredInches()+' in.)'"></span>
</label>
</div>
</div>
<!-- /ko -->  
</div> 
<div class="guided-nav-buttons col-xs-12">
<div class="col-xs-6 col-md-3">
<a href="#">
<button class="btn btn-primary filter-button" data-bind="click: findMatchingProducts">Find Matching Products</button>
</a>
</div>
<div class="col-xs-6 col-md-3">
<button class="btn btn-secondary reset-button" data-bind="click : clearRefinement()">Reset All Values</button>
</div>
</div>
<!-- /ko -->       
</div>