什么是ng-include的正确语法? [英] What is the correct syntax of ng-include?

查看:140
本文介绍了什么是ng-include的正确语法?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我试图在 ng-repeat 中包含一个HTML代码片段,但我无法让这些包含文件起作用。看起来, ng-include 的当前语法与以前不同:我看到很多使用示例

 < div ng-include src =path / file.html>< / div> 

但是在官方文档,它表示使用

 < div ng-include =path / file.html>< / div> 

但是 down the page 它显示为

 < 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-包括>



< ng-include = 视图/ sidepanel.html >< / NG-包括>



 < ng:include SRC = 视图/ sidepanel.html >< / NG:包括> 

我的代码片段不是很多代码,但是它有很多的功能;我在中阅读了< ng-repeat 中的动态加载模板,一个问题,所以我用 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>

Source

这篇关于什么是ng-include的正确语法?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆