我現在已經從n00b發展到關於Angular的n00b ++。
該解決方案位於Angular中用於模板的HTML片段中。
我可以用JS文件和HTML文件定義一個html模板。 JS文件通過URL引用HTML頁面。一般(在樣品中我看到)的路徑相對於這樣的:
angular.module('myApp.view1', ['ngRoute'])
.config(['$routeProvider', function($routeProvider) {
$routeProvider.when('/view1', {
templateUrl: 'view1/view1.html',
controller: 'View1Ctrl'
});
}])
.controller('View1Ctrl', [function() {}]);
但是,通過使用絕對路徑我可以參照一個外部資源:
angular.module(「myApp.view2」, [「ngRoute」])
.config(['$routeProvider', function($routeProvider) {
$routeProvider.when('/view2', {
templateUrl: host + '/app/view2/view2.html',
controller: 'View2Ctrl'
});
}])
.controller('View2Ctrl', [function() {}]);
通知我加入通過查看腳本標籤包括本JS文件計算的參數「主機」。
var scripts = document.getElementsByTagName('script');
var src = scripts[scripts.length - 1].src;
var host = src.match(new RegExp('https?://[^/]*'))[0];
但是要解決的第三個問題是處理CORS問題。在我的測試環境(node.js + express)中,我只是添加了'cors'庫,並且可以訪問我的「外部」網站。
var express = require('express'),
cors = require('cors'),
app = express();
app.use(cors());
app.use("/", express.static(__dirname));
app.listen(8001, function(){
console.log('CORS-enabled web server listening on port', 8001);
});