Question

我正在尝试使用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-controller标记和ng-include标记的语法，但是没有运气。网页中没有控制台错误。知道为什么它似乎不起作用吗？

背景故事/免责声明：我是这个项目的实习生，在首席开发人员突然离开后继承了该项目，这是我第一次进行任何形式的Web开发，而我只是从反复试验中学习工作。因此，如果我做的事情非常不正确，我绝对会去改进该过程！我之所以选择使用ng-include是因为我们已经实现了Angular，并且根据我的研究，这似乎是实现我想要的理论上最简单的方法。

Answer 1

您需要将src传递给ng-include指令，而不是src属性：例如：

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

或使用相对路径：

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

请查看official documentation了解详情

用法：为元素：

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

ng-include不会做任何事情

1 个答案: