KnockoutJs和模板 - 在Visual Studio中沒有代碼高亮/完成？

Question

我一直在玩淘汰賽網站上的教程，並喜歡與它合作。

所以我決定用它做一個簡單的網站。我傷心地發現，我的JavaScript模板（高亮，代碼自動完成）

示例模板工作時，從IDE失去了很多的支持：

<script type="text/html" id="taskTemplate"> 
    <li> 
     <input type="checkbox" data-bind="checked: isDone" /> 
     <input data-bind="value: title, enable: !isDone()" /> 
     <a href="#" data-bind="click: remove">Delete</a> 
    </li> 
</script> 

這事你得剛嚥下或者它是可以避免的/可修復的？ 模板似乎是構建頁面最常用的方法之一，所以我更願意從IDE獲得支持。

Answer 1

爲了解決這個問題，我創建兩個HTML助手對我的腳本標籤的開頭和我的腳本標籤的末尾。例如：

<% Html.BeginTemplate(new { id = "features-template" }); %> 
    <li> 
     <input type="checkbox" data-bind="checked: isDone" /> 
     <input data-bind="value: title, enable: !isDone()" /> 
     <a href="#" data-bind="click: remove">Delete</a> 
    </li> 
<% Html.EndTemplate(); %> 

Answer 2

這是停止Visual Studio的<script type="text/html"...>標記將標記的這一部分高亮顯示爲html。因此，這個問題/答案似乎是最接近你的答案。

Visual Studio - Markup syntax highlighting inside script[type:txt/html]

Answer 3

Keith提出了非常好的智能解決方案。不過，我想讓你知道KO 1.3擁有原生模板引擎。這是avaliable槽新的綁定：

• 如果
• 如不方便
• 與
• 的foreach！

你可以閱讀更多的史蒂夫·桑德森的宣佈：http://blog.stevensanderson.com/2011/08/31/knockout-1-3-0-beta-available/（1.控制流綁定）

所以，你的例子有這個樣子：

<ul data-bind="foreach: tasks"> 
<li> 
    <input type="checkbox" data-bind="checked: isDone" /> 
    <input data-bind="value: title, enable: !isDone()" /> 
    <a href="#" data-bind="click: remove">Delete</a> 
</li> 
</ul> 

Answer 4

我這裏使用的接受的答案，和因爲它幫助我，如果有人想實際的代碼，在這裏你去：

public string StartTemplate(string id) 
{ 
    return ("<script type=\"text/html\" id=\"" + id + "\">\r\n"); 
} 

public string EndTemplate() 
{ 
    return ("</script>\r\n"); 
} 

HTML：

<%= StartTemplate("WidgetTemplate")%> 
...actual template HTML goes here... 
<%= EndTemplate() %>