私はangularJSとPHPを使用してウェブサイトを構築しています。angularJS-コントローラからのHTTPコールの開始に失敗しました
<!DOCTYPE html>
<html ng-app="myApp">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Demo</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script>
<script src="angular.min.js"></script>
<script src="angular-route.min.js"></script>
<script src="commonController.js"></script>
<script src="homeController.js"></script>
<script src="loginController.js"></script>
<script src="app.js"></script>
</head>
<body>
<div class="header" ng-controller="CommonController"
ng-include="'header.html'"></div>
<div class="main" ng-view></div>
</body>
</html>
とヘッダ(header.html
):ウェブサイトは、多くのページlike-ホーム、会社案内などだから、
を持って、私はこのように私のHTMLビューに含まれるウェブサイトのための共通のヘッダを作成しましたページには、次のようになります。
<nav class="navbar-inverse navbar-fixed-top" role="navigation">
<a href="#/home">Home</a>
<a href="#/notifications" >{{vm.commonId}}</a>
</nav>
とヘッダコントローラは、ユーザIDを取得し、私は上記のリンクのいずれかのラベルとしてこのIDを表示しようとしています。httpコール(commonController.js
)
(function() {
angular
.module('myApp.common', ['ngRoute'])
.factory('myCommonService', function($http) {
var baseUrl = 'api/';
return {
getBasicUserInfo:function() {
return $http.get(baseUrl + 'getBasicUserInformation');
}
};
})
.controller('CommonController', function($scope, $routeParams, myCommonService) {
var vm = this;
myCommonService.getBasicUserInfo().success(function(data) {
vm.commonId = data.id;
});
});
})();
しかし、ページをナビゲートすると、ヘッダーは同じままです。だから、私はそのhttp呼び出しを開始することができません。私のウェブサイトには多くのページがあります。
これはできますか?私はこのプラットフォームではかなり新しいです。
ルート(app.js
)
(function() {
angular.module('myApp', [
'ngRoute',
'myApp.login',
'myApp.home',
'myApp.common'
])
.config(['$routeProvider', function($routeProvider) {
$routeProvider
.when('/login', {
controller: 'LoginController',
templateUrl: 'loginView.html',
controllerAs: 'vm'
})
.when('/home', {
controller: 'HomeController',
templateUrl: 'homeView.html',
controllerAs: 'vm'
})
.otherwise({
redirectTo: '/login'
});
}]);
})();
P.S:私は複雑さを軽減し、理解することが私のクエリは簡単にするために他のページを除外しました。
ありがとうございます!
に変更、ページナビゲーション(すなわち、ルート変更)の更新をトリガしたい場合あなたの問題は簡単に解決できます。これはあなたのための解決策ではありませんが、私はそれがあなたを助けるかもしれないと考えました。 – Sajan
ファイル内で '(function(){})()'をやっているのはなぜですか? – Chrillewoodz
これは初めてです。違いますか? @Chrillewoodz –