javascript - ng-include 不起作用

标签 javascript html angularjs angularjs-directive angularjs-ng-include

我使用 AngularJs 创建了一个简单的页面。当我尝试在 index.html 中包含 header.htm 时,浏览器中没有显示任何内容。

index.html

<html>
  <script 
  src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js">
  </script>
<body>
  <div ng-app="">
  <div ng-include="'views/header.htm'"></div>
  </div>
</body>
</html>

标题.htm

<h1>Header</h1>

最佳答案

您尚未显示您的文件夹结构以及 header.html 的定义。从下次开始尝试创建 MCVE .

我创建了一个fiddle展示它是如何工作的。

<div ng-controller="Ctrl">
    <div ng-include ="'header.html'" onload='myFunction()'></div>
 </div>

<!-- header.html -->
<script type="text/ng-template" id="header.html">
  Content of Header html
</script>

function Ctrl($scope) {
    $scope.myFunction = function() {
        alert('header loaded');
    }
}

关于javascript - ng-include 不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44871305/

相关文章:

javascript - 如何在 JavaScript 中使图像变大 x%(使用 jQuery)

javascript - 始终从 ExpressJS 默认错误处理程序返回 JSON 数据

html - 是否有用于 html 转义的 Emacs 包?

html - HTML 文件末尾的 CSS

javascript - 具有不同字段类型的angularjs动态表单

javascript - 没有 http ://or www 的 URL 正则表达式

javascript - Twitter 时间轴小部件在中型设备上消失(Bootstrap)

javascript - Greasemonkey 脚本可以对仅由 HTML 注释分割的页面部分进行重新排序?

javascript - 无法将值分配给 Angular 工厂内的变量?

javascript - 如何使用分割字符串函数的结果通过 Angular.js 进行 orderBy ?