AngularJS : Modifiy scope from antoher controller - angularjs

Question

I'm starting using Angular JS to build a mobile application with Ionic.
I'm trying a thing very simple but it does not work.
HTML
<div ng-controller="MyCtrl">
Hello, {{name}}!
</div>
<div ng-controller="MyCtrl2">
Hello, {{name}}!
</div>
<button ng-controller="MyCtrl" ng-click="MyCtrl.test()">click</button>
JS
var myApp = angular.module('myApp', []);
function MyCtrl($scope) {
$scope.name = 'Name 1';
$scope.test = function () {
$scope.name = 'Name on click !';
}
}
function MyCtrl2($scope) {
$scope.name = 'Name 2';
}
I have a similar structure in my Ionic App.
I need to modify the "$scope.name" from another template.
Thanks for help.
JSFiddle : http://jsfiddle.net/ADukg/6649/

Answer 1

This Fiddle will provide you with a working copy of your code.
<div ng-controller="MyCtrl">
<div>
Hello, {{name}}!
</div>
<div ng-controller="MyCtrl2">
Hello, {{name}}!
</div>
<button ng-click="test()">click</button>
</div>
(function() {
function MyCtrl($scope) {
$scope.name = 'Name 1';
$scope.test = function() {
$scope.name = 'Name on click !';
};
}
function MyCtrl2($scope) {
$scope.name = 'Name 2';
}
angular.module('myApp', [])
.controller('MyCtrl', MyCtrl)
.controller('MyCtrl2', MyCtrl2);
})();
You missed the following:
Assigning your controllers to your module
Wrapping the required template html in your ng-controller instead of
declaring it twice.

Answer 2

To modify scope from another controller you need to use either
$rootScope or angular js sevice .
Here is the $rootScope example:
angular.module('myApp', [])
.run(function($rootScope) {
$rootScope.test = new Date();
})
.controller('myCtrl', function($scope, $rootScope) {
$scope.change = function() {
$scope.test = new Date();
};
$scope.getOrig = function() {
return $rootScope.test;
};
})
.controller('myCtrl2', function($scope, $rootScope) {
$scope.change = function() {
$scope.test = new Date();
};
$scope.changeRs = function() {
$rootScope.test = new Date();
};
$scope.getOrig = function() {
return $rootScope.test;
};
})