Se o seu HTML é como abaixo, você pode fazer algo assim:
<div ng-controller="ParentCtrl">
<div ng-controller="ChildCtrl">
</div>
</div>
Em seguida, você pode acessar o escopo pai da seguinte maneira
function ParentCtrl($scope) {
$scope.cities = ["NY", "Amsterdam", "Barcelona"];
}
function ChildCtrl($scope) {
$scope.parentcities = $scope.$parent.cities;
}
Se você deseja acessar um controlador pai na sua exibição, precisa fazer algo assim:
<div ng-controller="xyzController as vm">
{{$parent.property}}
</div>
Veja jsFiddle: http://jsfiddle.net/2r728/
Atualizar
Na verdade, desde que você definiu cities
no controlador pai, seu controlador filho herdará todas as variáveis de escopo. Então, teoricamente, você não precisa ligar $parent
. O exemplo acima também pode ser escrito da seguinte maneira:
function ParentCtrl($scope) {
$scope.cities = ["NY","Amsterdam","Barcelona"];
}
function ChildCtrl($scope) {
$scope.parentCities = $scope.cities;
}
Os documentos do AngularJS usam essa abordagem, aqui você pode ler mais sobre o $scope
.
Outra atualização
Eu acho que essa é uma resposta melhor para o pôster original.
HTML
<div ng-app ng-controller="ParentCtrl as pc">
<div ng-controller="ChildCtrl as cc">
<pre>{{cc.parentCities | json}}</pre>
<pre>{{pc.cities | json}}</pre>
</div>
</div>
JS
function ParentCtrl() {
var vm = this;
vm.cities = ["NY", "Amsterdam", "Barcelona"];
}
function ChildCtrl() {
var vm = this;
ParentCtrl.apply(vm, arguments); // Inherit parent control
vm.parentCities = vm.cities;
}
Se você usar o controller as
método, também poderá acessar o escopo pai da seguinte maneira
function ChildCtrl($scope) {
var vm = this;
vm.parentCities = $scope.pc.cities; // note pc is a reference to the "ParentCtrl as pc"
}
Como você pode ver, existem muitas maneiras diferentes de acessar $scopes
.
function ParentCtrl() {
var vm = this;
vm.cities = ["NY", "Amsterdam", "Barcelona"];
}
function ChildCtrl($scope) {
var vm = this;
ParentCtrl.apply(vm, arguments);
vm.parentCitiesByScope = $scope.pc.cities;
vm.parentCities = vm.cities;
}
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.20/angular.min.js"></script>
<div ng-app ng-controller="ParentCtrl as pc">
<div ng-controller="ChildCtrl as cc">
<pre>{{cc.parentCities | json}}</pre>
<pre>{{cc.parentCitiesByScope | json }}</pre>
<pre>{{pc.cities | json}}</pre>
</div>
</div>