如何包含HTML頁面在另一個頁面（角）

http://www.interload.co.il/upload/5798737.jpg

當我用「創造」頁面，因爲它的工作原理篦一個differrent html頁面，但是當我把它給在主頁面中不起作用。

我試過這段代碼：（只包括事項的最後一行）

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
<meta charset="windows-1255"> 
 
<title>Insert title here</title> 
 
</head> 
 
<body> 
 
\t <table border="1"> 
 
\t \t <tr> 
 
\t \t \t <th>id</th> 
 
\t \t \t <th>name</th> 
 
\t \t \t <th>password</th> 
 
\t \t \t <th>email</th> 
 
\t \t \t <th>actions</th> 
 
\t \t </tr> 
 
\t \t <tr ng-repeat="c in g.companies"> 
 
\t \t \t <td>{{c.id}}</td> 
 
\t \t \t <td>{{c.name}}</td> 
 
\t \t \t <td>{{c.password}}</td> 
 
\t \t \t <td>{{c.email}}</td> 
 
\t \t \t <td><button data-ng-click="g.deleteCompany($index)">X</button> 
 
\t \t \t \t <button name="update" ng-click="g.showUpdateCompany()">O</button></td> 
 
\t \t \t <td ng-show="g.show"> 
 
\t \t \t Company id: <input value="{{c.id}}" disabled="disabled"><br/> 
 
\t \t \t Company name: <input value="{{c.name}}" disabled="disabled"><br/> 
 
\t \t \t Company password: <input ng-model="c.password"><br/> 
 
\t \t \t Company email: <input ng-model="c.email"><br/> 
 
\t \t \t <button ng-click="g.hideUpdateCompany(c)">Save</button> 
 
\t \t \t </td> 
 
\t \t \t <!--replace $index with c (the company)--> 
 
\t \t </tr> 
 
\t </table> 
 
\t <div ng-include src="'createCompany.html'"></div> 
 
</body> 
 
</html>

這是我想包括頁面：

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
<meta charset="windows-1255"> 
 
<title>Insert title here</title> 
 
</head> 
 
<body> 
 
<h2>Create new Company:</h2> 
 
Company ID: <input type="text" ng-model="c.newCompany.id"> <br> 
 
Company name: <input type="text" ng-model="c.newCompany.name"> <br> 
 
Company password: <input type="password" ng-model="c.newCompany.password"> <br> 
 
Company email: <input type="email" ng-model="c.newCompany.email"> <br> 
 
<button ng-click="c.createCompany()">Sumbit</button> <br> 
 
<p ng-show="c.success"> Company Added Successfully ! </p> 
 
<p ng-show="c.failure"> Company Failed to be added ! </p> 
 
</div> 
 
</body> 
 
</html>

個的conrollers在這裏設置（UI視圖）：

/** 
 
* 
 
*/ 
 
var app = angular.module("myApp", [ "ui.router" ]); 
 

 
app.config([ '$locationProvider', function($locationProvider) { 
 
\t $locationProvider.hashPrefix(''); 
 
} ]); 
 

 
app.config(function($stateProvider, $urlRouterProvider) { 
 

 
\t $stateProvider 
 
\t .state("main", { 
 
\t \t url : "/main", 
 
\t \t templateUrl : "../HTMLs/AdminMain.html", 
 
\t }) 
 
\t .state("getCompanies", { 
 
\t \t url : "/getCompanies", 
 
\t \t templateUrl : "../HTMLs/getCompanies.html", 
 
\t \t controller : "getCompaniesCTRL as g" 
 
\t }) 
 
\t .state("createCompany", { 
 
\t \t url : "/createCompany", 
 
\t \t templateUrl : "../HTMLs/createCompany.html", 
 
\t \t controller : "createCompanyCTRL as c" 
 
\t }) 
 
\t .state("404", { 
 
    \t url : "/404", 
 
     templateUrl : "../HTMLs/404.html" 
 
    }); 
 
\t $urlRouterProvider.when("", "/main"); // first browsing postfix is empty 
 
\t \t \t \t \t \t \t \t \t \t \t // --> route it to /main 
 
\t $urlRouterProvider.otherwise('/404'); // when no switch case matches --> 
 
\t \t \t \t \t \t \t \t \t \t \t // route to /404 
 
});

來源

2017-06-03 Daniel Liverant

爲正確的語法NG-包括是這樣的：

<div ng-include src="updateCompany.html"></div>

或

<ng-include src="updateCompany.html"></ng-include>

或

<ng-include src="'updateCompany.html'"></ng-include>

或

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

希望它可以幫助你

來源

2017-06-03 19:06:58

首先它真的幫助了！現在的問題是，當我使用這個頁面作爲一個單獨的頁面的所有角度的作品，但是當我把它包含到另一個它不是。向主線添加新代碼。 –

我看到你的路由不能分配控制器，因爲路由不合適。因此，把ng控制器放在你想包含的html視圖內而不是在routeProvider中。如果這有助於你投票答案所以人們知道並且可以使用這些信息。 –

是的，那是我做了什麼：

它的工作原理。謝謝。 –

如何包含HTML頁面在另一個頁面（角）

回答

相關問題