我一直在尝试编写一个简单的 angular.js 应用程序,其中包含另一个使用 ng-include 的文件。我一定做了一些事情/错过了一些事情,所以包含的文件不会被包含在内。我一定是在做一些根本性的错误,但看不出是什么。
这是 Index.html
<!DOCTYPE html>
<html>
<head ng-app="app">
<title>Demo</title>
<script data-require="angular.js@1.2.0" data-semver="1.2.0" src="http://code.angularjs.org/1.2.0/angular.js"></script>
<script data-require="angular-resource@1.2.0" data-semver="1.2.0" src="http://code.angularjs.org/1.2.0/angular-resource.js"></script>
<script type="text/javascript" src="script.js"></script>
</head>
<body>
<div ng-controller="appctrl">
<h1>Airports</h1>
<div ng-include="'extra.html'"></div>
<h1>Airports</h1>
</div>
</body>
</html>
文件 extra.html 包含要包含的元素
<h2>Inside</h2>
script.js是初始化angular的文件
(function () {
'use strict';
var app = angular.module('app', []);
app.run(['$route', function ($route) { // Include $route to kick start the router.
}]);
angular.module('app').controller('appctrl', [function AppCtrl() { }]);
});
我创建了Plunk来证明我的意思。那里没有太多内容:定义的 ng-app、对 Angular 文件的引用和几个描述插入点的标题。之间不显示任何内容。
在 angular.js 中使用 ng-include 的最简单方法是什么?
最佳答案
- 地点
ng-app
在你的 body 部分。 - 包括
angular-route.js
(例如<script src="http://code.angularjs.org/1.2.0/angular-route.js"></script>
)并将此依赖项添加到您的应用程序初始化(var app = angular.module('app',['ngRoute']
) - 不要将 script.js 代码放在
(function(){})
中. (如果你想这样做,调用这个函数(function(){})();
)
关于javascript - 使用 ng-include 的最简单方法,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24540294/