How to comment out knockout code in HTML - html

Is there any to comment out a knock out code in HTML, since the ko code is already in default html comment block.
<!-- ko if : isEditable() -->
<!-- Edit Mode -->
<div class="edit">Edit mode</div>
<!-- /ko -->
Can I comment the above section in my html

In our project we tend to use <!-- kocomment if : isEditable() --><!-- /kocomment --> syntax which effectively turns ko statement into a simple html comment (knockout does not care for such comments).
Or you may use shorter additions to ko word. Just make sure to comment out both opening and closing statement, there is also risk that this commented comment will not stand out, unless you have some knockout syntax highlighting.

Just change the ko to anything else!
<!-- koc if : isEditable() --> or <!-- kcomment if : isEditable() --> anything other that ko makes it as a comment.
As knockout looks only for html comments that start with ko, anything other than ko on an html comment will simply be a comment.

Related

HTML comment each line separately, not block comments

Noob question but I want to be able to quickly comment HTML code using keyboard shortcuts in VS code. Problem is I get this:-
<!-- <div class="whatever">
<h1>Hellow World!</h1>
<p>this is code I wrote in HTML</p>
</div> -->
instead of this:-
<!-- <div class="whatever"> -->
<!-- <h1>Hellow World!</h1> -->
<!-- <p>this is code I wrote in HTML</p> -->
<!-- </div> -->
Anyone know a good extension for this in VS Code? Thanks
Julien
See this extension written by me, Toggle Line Comments, that will do what you want.
-- or older answer --
Select through your text - i.e., from some part of the first line to some part of the last line you want separately commented. I.e., highlight your block of html to comment.
Shift-Alt-I will put a cursor at the end of each line.
Ctrl-/ will comment each line separately.
This only seems necessary for html, not js or scss for example.
I suppose if you wanted to reduce keystrokes you could make a macro for steps 2 and 3 combined.

Sublime Text HTML Block Comment Containing Comments

Is there a plugin to help with HTML commenting a block of code that may already contain other comments?
<div class="wrapper">
<div class="container"></div>
<!-- /.container -->
</div>
<!-- /.wrapper -->
BBEdit has a built in feature where if you select all of this code and apply a block comment, it will change the existing comments temporarily so that the main block comment can be applied. The output in the editor would look like:
<!--
<div class="wrapper">
<div class="container"></div>
<!~~ /.container ~~>
</div>
<!~~ /.wrapper ~~>
-->
Uncommenting the block would set the ~ characters back to dashes - so the individual comments would still be in place.
I am not looking for this specific functionality, but something that allows for block commenting content that already contains HTML comments without having to manually remove/edit the existing comments.
I could not find a plugin that does this, so I wrote one.
Installation instructions are available at https://github.com/philsinatra/HTMLNestedComments

sublime text - plugin for creating automatic start end html comments

Is there any plugin out there that creates begin, end HTML comments automatically? Like the following.
<!-- begin #page -->
<div id="page">
<!-- begin #header -->
<div id="header">
</div>
<!-- end #header -->
</div>
<!-- end #page -->
I am tired of commenting these out.
You may use this little snippet that I wrote:
<snippet>
<content><![CDATA[
<!-- .${1:className} -->
<div class="${1:className}">
${2}
</div>
<!-- /.${1:className} -->
]]></content>
<!-- Optional: Set a tabTrigger to define how to trigger the snippet -->
<tabTrigger>divc</tabTrigger>
<!-- Optional: Set a scope to limit where the snippet will trigger -->
<!-- <scope>source.python</scope> -->
</snippet>
and save it in Sublime Text #\Packages\User\divc.sublime-snippet
When you are done, you can use divc+tab to generate the required snippet
Not that i know of but you can create a custom snippet and use it when you like. This will allow you to insert that text without typing it out each time.
For directions check this link:
http://sublimetext.info/docs/en/extensibility/snippets.html
If you just want to comment something out, you can just select the content you want to comment and type ctrl + / and it will do the trick.

Display a string in a knockout bound virtual element?

Existing HTML looks like such:
<span>
<i class='icon-class'></i> OBJECT NAME HERE
</span>
I realize I can add a span and bind the text value to the object name, but it breaks the existing CSS layout. I could tweak the CSS, but before I go doing that (it's quite a complex template) I wanted to make sure there is not a way to do a virtual element that simply displays a string value.
<!-- ko string: objects.name --><!-- /ko -->
or something would be awesome, but from what I can see in the docs you can only use foreach or if in a virtual element.
Am I missing something or am I going to have to use a span?
You can use text binding:
<!-- ko text: objects.name --><!-- /ko -->
Here is working fiddle: http://jsfiddle.net/3RLfR/

HTML nested comments

Assuming some HTML like this...
<section>
<h1>Some stuff</h1>
<!-- That was some stuff... -->
</section>
I add comment tags around the HTML I want to comment out. I want to comment out everything, but the comment is closed by existing comment.
<!--
<section>
<h1>Some stuff</h1>
<!-- That was some stuff... -->
</section>
-->
What is the best way to handle this scenario without losing all my inline comments.
A HTML comment start with a <!-- and ends at the first --> encountered. There's no way to change this behavior. If you want to hide a large section with may contains comments during the development, you can wrap in a <div style="display:none"></div>. But don't do that in production, it's bad.
To comment block with nested comments:
sub inner (block) comments from "--" to "~~"
<!-- *********************************************************************
* IMPORTANT: to uncomment section
* sub inner comments "~~" -> "--" & remove this comment
*********************************************************************
<head>
<title>my doc's title</title> <~~! my doc's title ~~>
<link rel=stylesheet href="mydoc.css" type="text/css">
</head>
<body>
<~~! my doc's important html stuff ~~>
...
...
...
</body>
*********************************************************************
* IMPORTANT: to uncomment section
* sub inner comments "~~" -> "--" & remove this comment
*********************************************************************
-->
thus, outer most comment ignores all "invalid" inner (block) comments
As far as I know, there is no way to block that.
You need to be careful what you are commenting out or not.
See : http://www.w3.org/TR/html4/intro/sgmltut.html#h-3.2.4
What you can try is to use PHP to comment out HTML code...
Hope it helped!
You cannot comment it out without removing inner comments because HTML will consider the code as
<!--
<section>
----
---- //All this code comes under commented
----
some stuff... -->
It will consider only the beginning comment tag before <section> and end comment tag after "some stuff ...". So HTML will not treat the one comment tag after <h1> which is already under commented.
Look for shortcuts in your editor to do nested comments in html.
In VSCode I use this extension:
https://marketplace.visualstudio.com/items?itemName=philsinatra.nested-comments
This can with one keypress (un)comment a block of code and do a substitution of <!-- inner-comment --> to <!~~ inner-comment ~~> (just like guido's answer suggests), making commenting and uncommenting blocks just as easy as it is in other languages.
It also works for css /* comments */
There are probably similar extensions for other editors.
This works for me:
<!--[if False]>
Lots of html including <!-- comments -->
<![endif]-->