私はアプリケーションをビューに分割し、Angular UI Routerから始めようとしています。私は複数のビューを作成していますが、もし私が 'テンプレート'を使うとうまくいきますが、template.rlを外部の.htmlファイルと一緒に使うと空白のページしか得られません。AngularJS UIルータは、templateUrlで空白のページを表示します
HTML:
<!DOCTYPE html>
<head>
<meta charset="utf-8">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.3.0/angular-ui-router.js"></script>
<script src="searchApp.js"></script>
</head>
<body ng-app="searchApp">
<div ui-view>
</div>
</body>
</html>
searchApp.js:
var searchApp = angular.module('searchApp', ['ui.router'])
.config(['$stateProvider', '$urlRouterProvider', function($stateProvider, $urlRouterProvider) {
$stateProvider
.state('index', {
url: "/",
views: {
'': {
templateUrl: 'testView.html'
}
}
});
$urlRouterProvider.otherwise('/');
}])
testView.html
This is a test.
がここにありますPlunkr:https://plnkr.co/edit/4xQaHbx71mUNYRbTQntz
EDIT: これはPlunkerで動作しているようですが、私のコンピュータ上でローカルに動作しません。マックと勝利の両方で試してみました。
EDIT 2: 私はそれを作ることができるすべてはストレートファイルシステムから実行したときにUIルータtemplateUrlパラメータが動作しないということですが、多分、ファイルを開くことができるように、サーバーを必要ですか?これはそうですか?それのまわりで何か?
EDIT 3: ソリューション:templateUrlを使用して(または一般に任意のファイルを含めて)彼らはAjaxを介して、フェッチされているので、ときにページがファイルシステムから直接サーバを介して実行する必要はないと思われます。したがって、templateUrlを使用するには、ローカルマシンにサーバーをインストールするか、代わりにサーバーでコーディングを続ける必要があります。
サーバー**必見テンプレートページがAJAX経由でフェッチされているので**、UI-ルータで使用されます。 – Claies
これで説明します。どうもありがとうございました! –