简单的ng-include不起作用
简单的ng-include不起作用
提问于 2014-04-10 22:55:32
我是第一次使用AngularJS，我正在努力为我的页眉和页脚使用ng-include。
这是我的树：
myApp
assets
- CSS
- js
- controllers
- vendor
- angular.js
- route.js
......
......
......
main.js
pages
- partials
- structure
header.html
navigation.html
footer.html
index.html
home.htmlindex.html:
<!DOCTYPE html>
<html ng-app="app">
<head>
<title>AngularJS Test</title>
<script src="/assets/js/vendor/angular.js"></script>
<script src="/assets/js/vendor/route.js"></script>
<script src="/assets/js/vendor/resource.js"></script>
<script src="/assets/js/main.js"></script>
</head>
<body>
<div ng-include src="partials/structure/header.url"></div>
<div ng-include src="partials/structure/navigation.url"></div>
<div id="view" ng-view></div>
<div ng-include src="partials/structure/footer.url"></div>
</body>
</html>main.js
var app = angular.module("app", ["ngResource", "ngRoute"]);
app.config(function($routeProvider) {
$routeProvider.when("/login", {
templateUrl: "login.html",
controller: "LoginController"
});
$routeProvider.when("/home", {
templateUrl: "home.html",
controller: "HomeController"
});
$routeProvider.otherwise({ redirectTo: '/home'});
});
app.controller("HomeController", function($scope) {
$scope.title = "Home";
});home.html
<div>
<p>Welcome to the {{ title }} Page</p>
</div>当我进入home.html页面时，我的页眉、导航和页脚都不会出现。
回答 11
Stack Overflow用户
回答已采纳
发布于 2014-04-10 23:03:05
您正在执行include of header.url而不是Header.html。看起来您希望在src属性中使用文字，因此您应该将它们括在引号中，@DRiFTy在注释中提到了这一点。
变化
<div ng-include src="partials/structure/header.url"></div>
<div ng-include src="partials/structure/navigation.url"></div>
<div id="view" ng-view></div>
<div ng-include src="partials/structure/footer.url"></div>至
<div ng-include src="'partials/structure/header.html'"></div>
<div ng-include src="'partials/structure/navigation.html'"></div>
<div id="view" ng-view></div>
<div ng-include src="'partials/structure/footer.html'"></div>如果这不起作用，请检查浏览器控制台是否有404
Stack Overflow用户
发布于 2015-04-14 17:08:50
我有一个类似的问题，一个简单的ng-include不渲染：
<div ng-include="views/footer.html"></div>
我用单引号将文件路径括起来，它现在呈现：
<div ng-include="'views/footer.html'"></div>
Stack Overflow用户
发布于 2015-03-15 03:01:55
我遇到了类似的问题，让我来到了这里。
ng-include没有填充我的部分的内容，但没有控制台错误，也没有404的错误。
然后我意识到我做了什么。
解决我的问题:确保在ng-include之外拥有ng-app！太明显了。作为一个死板新手的代价。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/22991658
复制相关文章
相似问题