我刚开始在Visual Studio MVC项目中编写一个大型KnockoutJS代码库。到目前为止，除了虚拟元素之外，所有的东西都看起来相当简单。我理解这个需求，而且它相当漂亮。但是，因为虚拟元素是注解，所以缩进都很混乱，这使得阅读起来非常痛苦。
是否有可能将它们转换为实际的html元素，或者让Visual Studio/Resharper正确地缩进它们？
例如，我有一些类似下面的代码，它们都在相同的缩进级别。
<!-- ko with: Home -->
<!-- ko with: Model -->
<!-- ko foreach: Items -->
<!-- ko if: IsOpened -->
<button class="btn btn-default btn-sm" data-bind="click: $parents[1].SelectItem, css: { 'btn-warning': IsActived }, disable: $root.ItemDetail().IsLoading">
<i class="fa fa-calendar-check-o fa-lg" data-bind="css: { 'text-success': !IsActived() }"></i><span data-bind="text: Title"></span>
</button>
<!--/ko-->
<!--/ko-->
<!-- ko foreach: OtherItems -->
<!-- ko if: IsOpened -->
<button class="btn btn-default btn-sm" data-bind="click: $parents[1].SelectOtherItem, css: { 'btn-warning': IsActived }, disable: $root.OtherItemDetail().IsLoading">
<i class="fa fa-desktop fa-lg" data-bind="css: { 'text-info': !IsActived() }"></i><span data-bind="text: Title"></span>
</button>
<!--/ko-->
<!--/ko-->
...
<!--/ko-->
<!--/ko-->
1条答案
按热度按时间s2j5cfk01#
大多数时候，你可以使用实际的html元素而不是虚拟容器，只是为了让你有更好的可读性和缩进（使用
span或div）。从你的例子来看，我会这样做
然而，
select和li元素仍然需要这种无容器的控制流语法，在需要select和li的几个嵌套层的情况下，正如@Zoltán Tamási所说，我们可能不得不接受这种情况。