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

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

问题描述

我试图在 ng-repeat 中包含一个 HTML 片段,但我无法让包含工作.ng-include 的当前语法似乎与以前的不同:我看到很多示例使用

但在官方文档中,它说使用

然后在页面下方显示为

不管怎样,我试过了

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

我的代码片段不是很多代码,但有很多事情要做;我在 ng-repeat 中动态加载模板中读到这可能会导致问题,所以我替换了sidepanel.html 的内容只有单词 foo,仍然没有.

我也尝试过像这样直接在页面中声明模板:

并遍历所有引用脚本 idng-include 变体,但仍然没有.

我的页面中有更多内容,但现在我已将其精简为:

<头><!-- 角度包括--><body ng-view="views/main.html"><!-- view其实是在路由器里面设置的--><!-- views/main.html --><标题><h2>废话</h2></标题><article id="sidepanel"><section class="panel"><!-- 将有 ng-repeat="panel in panel" --><div ng-include src="views/sidepanel.html"></div></节></文章><!-- index.html --></html>

标题呈现,但我的模板没有.我在控制台或 Node 中没有收到任何错误,如果我在开发工具中单击 src="views/sidepanel.html" 中的链接,它会将我带到我的模板(并显示 foo).

解决方案

您必须在双引号内单引号 src 字符串:

<div ng-include 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天全站免登陆