Question

<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js">
</script>

</head>

<body ng-app="myApp">


    <div ng-include="'table.html'"></div>



</body>
</html>



<table>
    hdjhfdjhhd
    <thead>
    <tr>
    <th>Name</th>
    <th>Gender </th>
    <th>Age</th>
    </tr>
    </thead>

</table>

ng-include无效。浏览器中无法显示任何内容。

Answer 1

创建一个控制器并附加到html，然后就可以了。

Menu.html

<html ng-app="myApp">
<head>
    <meta charset="utf-8"/>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js">
    </script>
    <script src="../js/app.js"></script>

</head>

<body>
<h1>Menu</h1>
<div ng-include="'table.html'"></div>
</body>
</html>

app.js

var app = angular.module('myApp', []);

app.controller('MyCtrl', function($scope) {
  // Empty
});

Table.html

<p>
    Table template
</p>

see the directory structure below

Answer 2

html是不是只遵循我做的例子 https://plnkr.co/edit/CwTXcxTB90CfOgZ1ovKk?p=preview

<强>的index.html

<!DOCTYPE html>
<html ng-app="plunker">

  <head>
    <meta charset="utf-8" />
    <title>AngularJS Plunker</title>
    <script>document.write('<base href="' + document.location + '" />');</script>
    <link rel="stylesheet" href="style.css" />
   <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"> </script>
    <script src="app.js"></script>
  </head>

  <body ng-controller="MainCtrl">
    <p>Hello {{name}}!</p>
    <div ng-include="'table.html'"></div>
  </body>

</html>

<强> table.html

 <p>
    Hello Guys i am template2
    </p>

ng-include目录无法正常工作

2 个答案:

Menu.html

app.js

Table.html