问题描述
我试图在 ng-repeat 中包含一个HTML代码片段，但我无法让这些包含文件起作用。看起来， ng-include 的当前语法与以前不同：我看到很多使用示例
< div ng-include src =path / file.html>< / div>
但是在，它表示使用
< div ng-include =path / file.html>< / div>
但是它显示为
< div ng-include src =path / file.html>< / div>
无论如何，我都试过
< div ng-include =views / sidepanel.html>< / div>
< div ng-包括src =views / sidepanel.html>< / div>
< ng：include SRC = 视图/ sidepanel.html >< / NG：包括>
我的代码片段不是很多代码，但是它有很多的功能;我在中的动态加载模板，一个问题，所以我用 foo 这个词替换了 sidepanel.html 的内容， p>
我也尝试在页面中直接声明模板，如下所示：
< script type =text / ng-templateid =tmpl>
foo
< / script>
运行 ng-include 引用脚本的 id ，但仍然没有任何结果。
我的页面有更多内容，我把它剥离到了这个：
<！ - index.html - >
< html>
< head>
<！ - angular包括 - >
< / head>
< body ng-view =views / main.html> <！ - view实际上在路由器中设置 - >
<！ - views / main.html - >
< header>
< h2> Blah< / h2>
< / header>
< article id =sidepanel>
< section class =panel> <！ - 将在面板中具有ng-repeat =面板 - >
< div ng-include src =views / sidepanel.html>< / div>
< / section>
< / article>
<！ - index.html - >
< / body>
< / html>
标题呈现，但我的模板没有。我在控制台或Node中没有发现任何错误，如果我在开发工具中单击 src =views / sidepanel.html中的链接，它会将我带到我的模板中（并显示 foo ）。
src 双引号内的字符串：
< div ng-包括src ='views / sidepanel.html'>< / div>
I’m trying to include an HTML snippet inside of an ng-repeat, but I can’t get the include to work. It seems the current syntax of ng-include is different than what it was previously: I see many examples using
<div ng-include src="path/file.html"></div>
But in the official docs, it says to use
<div ng-include="path/file.html"></div>
But then down the page it is shown as
<div ng-include src="path/file.html"></div>
Regardless, I tried
<div ng-include="views/sidepanel.html"></div>
<div ng-include src="views/sidepanel.html"></div>
<ng-include src="views/sidepanel.html"></ng-include>
<ng-include="views/sidepanel.html"></ng-include>
<ng:include src="views/sidepanel.html"></ng:include>
My snippet is not very much code, but it’s got a lot going on; I read in Dynamically load template inside ng-repeat that that could cause a problem, so I replaced the content of sidepanel.html with just the word foo, and still nothing.
I also tried declaring the template directly in the page like this:
<script type="text/ng-template" id="tmpl">
foo
</script>
And running through all the variations of ng-include referencing the script’s id, and still nothing.
My page had a lot more in it, but now I’ve stripped it down to just this:
<!-- index.html -->
<html>
<head>
<!-- angular includes -->
</head>
<body ng-view="views/main.html"> <!-- view is actually set in the router -->
<!-- views/main.html -->
<header>
<h2>Blah</h2>
</header>
<article id="sidepanel">
<section class="panel"> <!-- will have ng-repeat="panel in panels" -->
<div ng-include src="views/sidepanel.html"></div>
</section>
</article>
<!-- index.html -->
</body>
</html>
The header renders, but then my template doesn’t. I get no errors in the console or from Node, and if I click the link in src="views/sidepanel.html" in dev tools, it takes me to my template (and displays foo).
You have to single quote your src string inside of the double quotes:
<div ng-include src="'views/sidepanel.html'"></div>
这篇关于什么是ng-include的正确语法？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！