I call a my controller with $routeProvider like this:
$routeProvider
.when('/home', {
templateUrl: "partials/main.html",
controller: "AppCtrl"
});
So the focus of $scope in the controller will change only the content of partials/main.html.
I would need to change {{status}} in index.html, but it won't change if I do $scope.status = 'ready'; in the controller, it will change only if it was in main.html.
How can I make this work ?
Thank you very much.
The scope associated with AppCtrl should prototypically inherit from the scope associated with the controller you have defined in index.html. Define a method on that controller, and then you can call it from your child controller/scope (because of the way JavaScript prototypal inheritance works):
function MainCtrl($scope) {
$scope.updateStatus = function(newStatus) {
$scope.status = newStatus;
}
}
function AppCtrl($scope) {
...
$scope.updateStatus(....);
}
Fiddle. In the fiddle, I don't use ng-view, but it still shows the concept.
