jac*_*cob 397 javascript html5 repeater include angularjs
我正在尝试在其中包含一个HTML代码段ng-repeat,但我无法让include工作.似乎当前的语法与ng-include以前的语法不同:我看到许多例子使用
<div ng-include src="path/file.html"></div>
但在官方文档中,它表示要使用
<div ng-include="path/file.html"></div>
但是然后在页面上显示为
<div ng-include src="path/file.html"></div>
无论如何,我试过了
<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,但仍然没有.
我也尝试直接在页面中声明模板,如下所示:
<script type="text/ng-template" id="tmpl">
foo
</script>
并贯穿ng-include引用脚本的所有变体,但id仍然没有.
我的页面中有更多内容,但现在我已将其删除到这个:
<!-- 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>
标题呈现,但我的模板没有.我在控制台或Node中没有错误,如果我单击src="views/sidepanel.html"开发工具中的链接,它会将我带到我的模板(并显示foo).
jac*_*cob 770
你必须src在双引号内单引号你的字符串:
<div ng-include src="'views/sidepanel.html'"></div>
小智 132
<ng-include src="'views/sidepanel.html'"></ng-include>
要么
<div ng-include="'views/sidepanel.html'"></div>
要么
<div ng-include src="'views/sidepanel.html'"></div>
要记住的要点:
- > src中没有空格
- >请记住在src的双引号中使用单引号
Ben*_*ren 49
对于那些故障排除,重要的是要知道ng-include要求url路径来自app根目录而不是来自partial.html所在的同一目录.(而partial.html是可以找到内联ng-include标记标记的视图文件).
例如:
正确:div ng-include src ="'/views/partials/tabSlides/add-more.html'">
不正确:div ng-include src ="'add-more.html'">
对于那些正在寻找部分最短的"项目渲染器"解决方案的人来说,所以ng-repeat和ng-include的组合:
<div ng-repeat="item in items" ng-include src="'views/partials/item.html'" />
实际上,如果你像这样使用一个转发器,它会起作用,但不适用于其中两个转发器!Angular(v1.2.16)会因为某些原因而出于某种原因而变得惊慌失措,因此以前xhtml方式关闭div会更安全:
<div ng-repeat="item in items" ng-include src="'views/partials/item.html'"></div>
也许这对初学者有帮助
<!doctype html>
<html lang="en" ng-app>
<head>
<meta charset="utf-8">
<title></title>
<link rel="icon" href="favicon.ico">
<link rel="stylesheet" href="custom.css">
</head>
<body>
<div ng-include src="'view/01.html'"></div>
<div ng-include src="'view/02.html'"></div>
<script src="angular.min.js"></script>
</body>
</html>
这对我有用:
ng-include src="'views/templates/drivingskills.html'"
完整的div:
<div id="drivivgskills" ng-controller="DrivingSkillsCtrl" ng-view ng-include src="'views/templates/drivingskills.html'" ></div>
| 归档时间： |
|
| 查看次数： |
306038 次 |
| 最近记录： |