Visual Studio - 为HTML模板和语法突出显示使用自定义脚本标记类型

Question

我正在使用Visual Studio 2012来编辑HTML和JavaScript.我正在使用内联脚本标记中的部分视图添加模板(请参阅下面的代码).AngularJS是一个Javascript框架,要求类型为text/ng-template,但Visual Studio不会将其识别为HTML,也不提供语法突出显示.如果类型是text/HTML一切正常.

我的问题:Visual Studio 2012中是否有一种方法可以将自定义脚本类型与HTML语法高亮相关联？该解决方案不仅适用于text/ng-template,而且适用于您希望HTML语法突出显示的其他类型.

<script type="text/ng-template" id="filterOrder.html">
    <!-- Sidebar comment-->
    Search: <input ng-model="query"/> 
    Sort by: 
    <select ng-model="orderProp">
        <option value="name">Alphabetical</option>
        <option value="age">Newest</option>
    </select>
    <div id="status">Current filter: {{query}}</div>
</script>

Answer 1

我无法说服 VS2012 突出显示text/ng-template脚本，因此我求助于使用text/template并在启动代码中添加了一些内容。这将枚举您想要的任何类型的脚本标签并将它们添加到 $templateCache。

    var app = angular.module('app', [...]);

    app.run(function ($templateCache) {
        // <script type="text/ng-template"> ... is preferred, but VS 2012 doesn't give intellisense there
        angular.element('script[type="text/template"]').each(function(idx, el) {
            $templateCache.put(el.id, el.innerHTML);
        });
    });

text/template在我的设置中触发 HTML 智能感知。

<script type="text/template" id="home.html">
    <h3>HTML intellisense, code completion, and formatting!</h3>
</script>