admin管理员组文章数量:1323366
Hi I am starting to learn angular and I'm running into a problem when I use a bination of ng-repeat with ng-include. No matter what I do I cannot get the templates to render. I have a simple controller that creates a list of workspaces and each workspace has a TemplateUrl property.
I know the value is correct because if I just render out the raw text {{workspace.TemplateUrl}} and then put that directly into the ng-include it works no problem. It just never seems to work when its ing from the controller. I have tried putting the template path in quotes like this too but it makes no difference.
$scope.Workspaces.push(new Workspace("'/app/templates/Template1.html'", "Workspace 1"));
When I run it I am seeing no requests to pull the template. Can anyone help on this as its driving me a little nuts.
<!DOCTYPE html>
<html ng-app>
<head>
<title>Workspaces</title>
<!-- Bootstrap -->
<link href="css/bootstrap.css" rel="stylesheet" media="screen">
<script src="app/libraries/jquery.js"></script>
<script src="app/libraries/bootstrap.min.js"></script>
<script src="app/libraries/angular.js"></script>
<script src="app/app.js"></script>
</head>
<body ng-controller="HostController">
<div>
<ul class="unstyled">
<li ng-repeat="workspace in Workspaces">
<p>{{workspace.TemplateUrl}}</p>
<hr />
<div ng-include="{{workspace.TemplateUrl}}"></div>
</li>
</ul>
</div>
</body>
</html>
Controller code
var Workspace = (function () {
function Workspace(templateUrl, name) {
this.TemplateUrl = templateUrl;
this.Name = name;
}
return Workspace;
})();
function HostController($scope) {
$scope.Workspaces = new Array();
$scope.Workspaces.push(new Workspace("/app/templates/Template1.html", "Workspace 1"));
$scope.Workspaces.push(new Workspace("/app/templates/Template2.html", "Workspace 2"));
$scope.Workspaces.push(new Workspace("/app/templates/Template1.html", "Workspace 3"));
$scope.Workspaces.push(new Workspace("/app/templates/Template2.html", "Workspace 4"));
$scope.Workspaces.push(new Workspace("/app/templates/Template1.html", "Workspace 5"));
}
Hi I am starting to learn angular and I'm running into a problem when I use a bination of ng-repeat with ng-include. No matter what I do I cannot get the templates to render. I have a simple controller that creates a list of workspaces and each workspace has a TemplateUrl property.
I know the value is correct because if I just render out the raw text {{workspace.TemplateUrl}} and then put that directly into the ng-include it works no problem. It just never seems to work when its ing from the controller. I have tried putting the template path in quotes like this too but it makes no difference.
$scope.Workspaces.push(new Workspace("'/app/templates/Template1.html'", "Workspace 1"));
When I run it I am seeing no requests to pull the template. Can anyone help on this as its driving me a little nuts.
<!DOCTYPE html>
<html ng-app>
<head>
<title>Workspaces</title>
<!-- Bootstrap -->
<link href="css/bootstrap.css" rel="stylesheet" media="screen">
<script src="app/libraries/jquery.js"></script>
<script src="app/libraries/bootstrap.min.js"></script>
<script src="app/libraries/angular.js"></script>
<script src="app/app.js"></script>
</head>
<body ng-controller="HostController">
<div>
<ul class="unstyled">
<li ng-repeat="workspace in Workspaces">
<p>{{workspace.TemplateUrl}}</p>
<hr />
<div ng-include="{{workspace.TemplateUrl}}"></div>
</li>
</ul>
</div>
</body>
</html>
Controller code
var Workspace = (function () {
function Workspace(templateUrl, name) {
this.TemplateUrl = templateUrl;
this.Name = name;
}
return Workspace;
})();
function HostController($scope) {
$scope.Workspaces = new Array();
$scope.Workspaces.push(new Workspace("/app/templates/Template1.html", "Workspace 1"));
$scope.Workspaces.push(new Workspace("/app/templates/Template2.html", "Workspace 2"));
$scope.Workspaces.push(new Workspace("/app/templates/Template1.html", "Workspace 3"));
$scope.Workspaces.push(new Workspace("/app/templates/Template2.html", "Workspace 4"));
$scope.Workspaces.push(new Workspace("/app/templates/Template1.html", "Workspace 5"));
}
Share
Improve this question
asked Jan 1, 2013 at 17:39
CompareTheMooCatCompareTheMooCat
1,0472 gold badges11 silver badges14 bronze badges
1 Answer
Reset to default 9I quote Your code
<div ng-include="{{workspace.TemplateUrl}}"></div>
should be
<div ng-include="workspace.TemplateUrl"></div>
since it is a ng statement.
本文标签: javascriptAngularJSngrepeat with nginclude not renderingStack Overflow
版权声明:本文标题:javascript - AngularJS, ng-repeat with ng-include not rendering - Stack Overflow 内容由网友自发贡献,该文观点仅代表作者本人, 转载请联系作者并注明出处:http://www.betaflare.com/web/1742124429a2421872.html, 本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容,一经查实,本站将立刻删除。
发表评论