在角的NG-开关使用HTML模板 [英] Using html templates in angular's ng-switch

问题描述

林作出交互菜单，随着用户点击移动。
我想知道是否有一种方法，包括在NG-开关HTML模板，
因为所有的逻辑是在每一个'开关'不同 - 它会造成巨大的HTML文件

 ＆LT; D​​IV CLASS =内容上=选择NG开关＆GT;
 ＆LT; D​​IV NG-开关时=1＆GT;
   ＆所述; H1大于1＆下; / H1＆GT;
 ＆LT; / DIV＆GT;
 ＆LT; D​​IV NG-开关时=2＆GT;
   ＆所述; H1→2＆下; / H1＆GT;
 ＆LT; / DIV＆GT;
＆LT; / DIV＆GT;
 

解决方案

使用 ngInclude ：

 ＆LT; D​​IV CLASS =内容上=选择NG开关＆GT;
    ＆LT; D​​IV NG-开关时=1＆GT;
        ＆LT; NG-包括SRC ='template1.html'＆GT;＆LT; / NG-包括＆GT;
    ＆LT; / DIV＆GT;
    ＆LT; D​​IV NG-开关时=2＆GT;
        ＆LT; NG-包括SRC ='template2.html'＆GT;＆LT; / NG-包括＆GT;
    ＆LT; / DIV＆GT;
＆LT; / DIV＆GT;
 

请注意：不要忘了，如果你是硬编码的路径，使用单引号包裹双引号中

。

Im making an 'interactive menu' that moves along with user clicks. Im wondering if there is a way to include html templates in ng-switch, since all the logic is different in each 'switch' - it will result in huge html files.

<div class="content" ng-switch on="selection">
 <div ng-switch-when="1" >
   <h1>1</h1>
 </div>
 <div ng-switch-when="2">
   <h1>2</h1>       
 </div>
</div>

解决方案

Use ngInclude:

<div class="content" ng-switch on="selection">
    <div ng-switch-when="1" >
        <ng-include src="'template1.html'"></ng-include>
    </div>
    <div ng-switch-when="2">
        <ng-include src="'template2.html'"></ng-include>
    </div>
</div>

Note: Dont forget to use single quotes wrapped inside the double quotes if you are hard-coding the path.

这篇关于在角的NG-开关使用HTML模板的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！