2016-08-17 10 views
2

私はアプリケーションでcontrollerAs構文を使用していますが、子コントローラから親コントローラの関数にアクセスしたいのですが、これは$ scopeを注入することで実現できますが、Angularはコードから$スコープを取り除くために非常に努力しました。 $ scopeを挿入せずにこれを行うよりエレガントな方法があるかどうかを知りたいのですか?私は$スコープを注入し、その後$scope.app.log()によってログ機能にアクセスすることができます知っている子コントローラから親コントローラのメンバーにアクセスするエレガントな方法は何ですか?

angular.module('test').controller('AppCtrl', function() { 
    var vm = this; 
    vm.log = function() { 
    console.log("Output"); 
    } 
} 

angular.module('test').controller('ChildCtrl', function() { 
    var vm = this; 
    // Here I want to access parent's log() function 
} 

が、bettter方法があります:

<div ng-controller="AppCtrl as app"> 
    <div ng-controller="ChildCtrl as child"> 
    </div> 
</div> 

と、対応コントローラ:ここ

は、HTMLの例です$scope?

+0

可能な複製(http://stackoverflow.com/questions/21453697/angularjs-access-parent-scope -from-child-controller) – Ted

答えて

2

1つのオプションは、角度1.5のコンポーネント(docs)を使用することです。

これは、子コンポーネントに次のようになります。

.component('childComponent', { 
    require: { 
    parentCtrl: '^ parentCtrl' 
    } 
    controller: function() { 
    this.parentCtrl.anyMethod(); //here we are accessing parent's controller properties 
    } 

    ... 

}); 
+0

プランナーリンクが壊れているようです。 – didierc

+1

さて、私が想定しているドキュメントの例にリンクしたいと思います... – didierc

1

この答えは質問が頼まれた約6ヶ月後に掲載されているが、私は私が提案する解決策を確認するために他の訪問者に役立つかもしれないと思います以下。

角度コントローラにはプロトタイプの継承があります。つまり、親コントローラの$scopeオブジェクトには、子ノードからアクセス可能です。プロパティとメソッドを$scopeにバインドする代わりにthisキーワードとcontroller asという構文を使用すると、子どもの$scopeは親のメンバーに直接アクセスできませんが、$scope.$parentを介してアクセスできます。

1)あなたは$scope経由で親コントローラの$scopeオブジェクトにプロパティとメソッドをバインドし、それらに直接アクセスすることができます:あなたの問題を解決するには、2つの可能性(クリーンかつ簡単に)方法がある、と述べた

あなたが望むならば、あなたは普通のClassのようにプロパティ/メソッドを上書きすることができます)。あなたは親コントローラ上の

$scope.log = function() { console.log("output") } 

を定義した場合 だから、あなたの子供のコントローラは単に$scope.log()を呼び出すことによって、それへのアクセス権を持っています。 Check this fiddle

2)または、これらは親の$scopeのメンバーではないので、子供の$scopeオブジェクトは、親のプロパティとメソッドに直接アクセスすることはできません、ビューにコントローラをバインドするthisキーワードとcontroller as構文を使用しているので、しかし、thisの親コントローラ自体のインスタンスです。このシナリオでは、$scope.$parent経由で親にアクセスする必要があります。とりわけ、 "app"( "AppCtrl"のために作成したエイリアス、つまりコントローラ自体のインスタンス)は$scope.$parentのプロパティになります。 "log"メソッドはコントローラー自身のメンバーであり、$scopeオブジェクトではないので、 "log"は "app"のメンバーであり、子コントローラーは親の "log"メソッドにアクセスできます。$scope.$parent.app.log()。ここでCheck this fiddle

は、いくつかは、さらに、このトピックに読んで:[子コントローラからangularjsアクセス親スコープ]のhttps://github.com/angular/angular.js/wiki/Understanding-Scopes

関連する問題