J'utilise ng-view pour inclure des vues partielles AngularJS, et je veux mettre à jour le titre de la page et les balises d'en-tête h1 en fonction de la vue incluse. Cependant, ces balises sont hors de portée des contrôleurs de vues partielles, et je n'arrive donc pas à comprendre comment les lier aux données définies dans les contrôleurs.
Si c'était ASP.NET MVC, vous pourriez utiliser @ViewBag pour le faire, mais je ne connais pas l'équivalent dans AngularJS. J'ai fait des recherches sur les services partagés, les événements, etc. mais je n'arrive toujours pas à le faire fonctionner. Si je peux modifier mon exemple pour qu'il fonctionne, ce sera très apprécié.
Mon HTML :
<html data-ng-app="myModule">
<head>
<!-- include js files -->
<title><!-- should changed when ng-view changes --></title>
</head>
<body>
<h1><!-- should changed when ng-view changes --></h1>
<div data-ng-view></div>
</body>
</html>
Mon JavaScript :
var myModule = angular.module('myModule', []);
myModule.config(['$routeProvider', function($routeProvider) {
$routeProvider.
when('/test1', {templateUrl: 'test1.html', controller: Test1Ctrl}).
when('/test2', {templateUrl: 'test2.html', controller: Test2Ctrl}).
otherwise({redirectTo: '/test1'});
}]);
function Test1Ctrl($scope, $http) { $scope.header = "Test 1";
/* ^ how can I put this in title and h1 */ }
function Test2Ctrl($scope, $http) { $scope.header = "Test 2"; }