I have an angular app, and want to in a template, add other as divs. ng-include seemed like a perfect choice.
我有一个角度应用程序,并希望在模板中,添加其他作为div。 ng-include似乎是一个完美的选择。
In main.html
在main.html中
<div id="page-wrapper">
<div ng-include src="'/partials/module.html'"></div>
</div>
In module.html
在module.html中
<div class="module">
<h1>Module</h1>
</div>
All files live in the partials-folder in the app.
所有文件都存在于应用程序的partials-folder中。
When running this, at the place in the html code, I get <!-- ngInclude: -->
, and substituting the divs in main.html with the also supported ng-include tag, it compiles to <!-- ngInclude: undefined -->
.
运行它时,在html代码中的位置,我得到<! - ngInclude: - >,并用main支持的ng-include标记替换main.html中的div,它编译为<! - ngInclude: undefined - >。
Does anyone know what might be the problem?
有谁知道可能是什么问题?
4 个解决方案
#1
15
You only use src="" when using ng-include as an element:
使用ng-include作为元素时,只使用src =“”:
<ng-include src="'/partial.html'"></ng-include>
When using ng-include as an attribute, you put the partial URL right in the attribute itself:
使用ng-include作为属性时,将部分URL放在属性本身中:
<div ng-include="'/partial.html'"></div>
See https://docs.angularjs.org/api/ng/directive/ngInclude for the two use-cases.
有关这两个用例,请参阅https://docs.angularjs.org/api/ng/directive/ngInclude。
#2
6
After hours I resolved it for mine, it's all about using single quotes using between double quotes.
几个小时后我解决了它,这是关于在双引号之间使用单引号。
<!--it will not work-->
<ng-include src="views/header.html"></ng-include>
<!--it will work :)-->
<!--Difference is single quotes along with double quotes around src string-->
<ng-include src="'views/header.html'"></ng-include>
#3
0
I was facing the exact issue, compiler might not be finding the src path you provided. remove the first / in the path. compiler will automatically append / to the root context and tries to find the path. It worked for me.
我遇到了确切的问题,编译器可能找不到您提供的src路径。删除路径中的第一个/。编译器将自动附加/到根上下文并尝试查找路径。它对我有用。
<div ng-include src="'/partials/module.html'"></div>
replace with
用。。。来代替
<div ng-include src="'partials/module.html'"></div>
#4
-1
It must be a scope issue. Make sure the $scope
object is passed properly and do not forget to include the controllers and services pertaining to the partial in your main page!
它必须是范围问题。确保$ scope对象正确传递,并且不要忘记在主页面中包含与partial相关的控制器和服务!
#1
15
You only use src="" when using ng-include as an element:
使用ng-include作为元素时,只使用src =“”:
<ng-include src="'/partial.html'"></ng-include>
When using ng-include as an attribute, you put the partial URL right in the attribute itself:
使用ng-include作为属性时,将部分URL放在属性本身中:
<div ng-include="'/partial.html'"></div>
See https://docs.angularjs.org/api/ng/directive/ngInclude for the two use-cases.
有关这两个用例,请参阅https://docs.angularjs.org/api/ng/directive/ngInclude。
#2
6
After hours I resolved it for mine, it's all about using single quotes using between double quotes.
几个小时后我解决了它,这是关于在双引号之间使用单引号。
<!--it will not work-->
<ng-include src="views/header.html"></ng-include>
<!--it will work :)-->
<!--Difference is single quotes along with double quotes around src string-->
<ng-include src="'views/header.html'"></ng-include>
#3
0
I was facing the exact issue, compiler might not be finding the src path you provided. remove the first / in the path. compiler will automatically append / to the root context and tries to find the path. It worked for me.
我遇到了确切的问题,编译器可能找不到您提供的src路径。删除路径中的第一个/。编译器将自动附加/到根上下文并尝试查找路径。它对我有用。
<div ng-include src="'/partials/module.html'"></div>
replace with
用。。。来代替
<div ng-include src="'partials/module.html'"></div>
#4
-1
It must be a scope issue. Make sure the $scope
object is passed properly and do not forget to include the controllers and services pertaining to the partial in your main page!
它必须是范围问题。确保$ scope对象正确传递,并且不要忘记在主页面中包含与partial相关的控制器和服务!