ng-include 不执行任何操作



我正试图使用ng-include在软件的网页上包含一些HTML,但我似乎无法使其工作。目前,我正在使用最终目标的简化版本进行测试。

我的项目树的相关片段:

-web
--dragonweb
---src
----app
-----dragon
-------dragon.css
-------dragon.html
-------dragon.spec.ts
-------dragon.ts
-------test.html

dragon.html

<div ng-app = "" ng-controller="test">
testing
<div ng-include="" src="'app/src/dragon/test.html'"></div>
</div>

test.html

<div>
This is an included file
</div>

网页上的预期输出:

测试

这是一个包含的文件。

网页上的实际输出:

测试

我尝试过使用不同长度的路径来访问test.html,但没有成功。我也一直在摆弄ng控制器标签的使用,以及ng包含标签的语法,但运气不好。网页中没有控制台错误。知道为什么它似乎不起作用吗?

背景/免责声明:在首席开发人员突然离开后,我在继承这个项目之前是这个项目的实习生,这是我第一次做任何类型的网络开发,我只是在工作中从试错中学习。所以,如果我做的事情完全不正确,我绝对会留心如何改进这个过程!我选择尝试使用ng-include,因为我们已经实现了Angular,根据我的研究,这在理论上似乎是实现我想要的最简单的方法。

您需要传递src-to-ng-include指令,而不是src属性:例如:

<div ng-include="'app/src/dragon/test.html'"></div>

或使用相对路径:

<div ng-include="'./test.html'"></div>

有关的详细信息,请查看官方文件

用法:作为元素

<ng-include
src="'string_url'">
...
</ng-include>

作为属性

<ANY_ELEMENT_TAG
ng-include="'string_url'">
...
</ANY_ELEMENT_TAG>

作为CSS类:

<ANY class="ng-include: string; [onload: string;] [autoscroll: string;]"> ... </ANY>

最新更新