2016-04-28 4 views
3

私は角度の世界では初心者だと私はそれが親スコープにアクセスするために$parentグローバル変数を使用することをお勧めだかどうかを知りたいと思います。たとえば、data-ng-ifは、親スコープにアクセスする際にいくつかの問題を引き起こす孤立スコープを作成するため、唯一の方法は$parent.myVariableです。

どれたとえば、私のコードがきれいで、良いプラクティスに従っていることを確認するために何かアドバイスはかなりのだろう。

+0

を通過 'NG-if'は、分離株のスコープを作成しません。継承されたスコープが作成されます。 – georgeawg

答えて

2

ng-ifディレクティブはsee demo、関係なく、親スコープが表示されるはずです。ディレクティブの分離株のスコープの場合

、それはインタフェースを介してダウン$scopeオブジェクトを渡すのではなく、$parentのプロパティの存在に数える方が良いでしょう:

ビュー

app.controller("myCtrl", function($scope){ 
    $scope.foo = "bar"; 
}); 

app.directive("myDirective", function(){ 
    return { 
     scope: { 
      // expect foo to be passed to the directive 
      // = means conserve bi directional binding 
      foo: "=" 
     }, 
     link: function(scope) { 
      ... // scope.foo is defined 
     } 
    } 
}); 

<div ng-controller="myCtrl"> 
    <my-directive foo="foo"></my-directive> 
</div> 
1

ディレクティブを分離し、自己完結型にし、ディレクティブに外部の側面が必要な場合は、それらを挿入またはバインドすることをお勧めします。特定の状況で使用されるものに頼るのは賢明ではありません。

一つの例は次のとおりです。

<div ng-controller="Parent as parent"> 

    <div ng-if="parent.showMessage"> 
    Some simple message. 
    </div> 

    <div child-one parent="parent"></div> 

</div> 

コントローラ

app.controller('Parent', function() { 
    var self = this; 
    self.showMessage = true; 
}); 

app.directive('childOne', function() { 
    return { 
     controllerAs: 'childOne', 
     controller: function($scope, $attrs) { 
      var parent = $scope.$eval($attrs.parent); 

      var self = this; 
      self.foo = 'bar'; 
      // Some simple logic. 
      if (self.foo === 'bar') { 
       parent.showMessage = false; 
      } 
     } 
    }; 
}); 
1

そうすることを完全に大丈夫そうです。

<div ng-app ng-controller="NameCtrl"> 
    <div ng-controller="ChildCtrl as vm"> 
     {{$parent.names}} 
    </div> 
</div> 

function NameCtrl($scope) { 
    $scope.names = ["Tom", "Dick", "Harry"]; 
} 

function ChildCtrl($scope) { 
    $scope.parentnames = $scope.$parent.names; 
} 

参照:http://jsfiddle.net/8bojdnpt/

ビューの優れた実践の観点から、彼らがバッファに残っていないので、あなたはまた、不要なスコープを破壊することができますので、この方法でも良いです。

しかし、John Papaは$parenthttps://github.com/johnpapa/angular-styleguide/blob/master/a1/README.md#controllersの使用に対してアドバイスしています。代わりに、controller as構文を使用することをお勧めします。

3

それは良い習慣ではありません、それはあなたのトラブルの原因となります。あなたは、あなたがあなたのダイビング{{ $parent.myVariable }}の内側に使用するコントローラと<div ng-if>にバインドさ<div>決定しているとしましょう。あなたが別のものの中に入れ子にする必要があればどうなるでしょうng-if?またはng-ifのみを削除しますか?

私はあなたが、コントローラ$scope変数に格納されているオブジェクトの内部変数を保存することをお勧めします。
コントローラにはこのようなものがあるはずです。

$scope.MyValues = {}; 
$scope.MyValues.myVariable = 5; 

は、今すぐあなたの <div>$parentの使用を避けることができ、 {{ MyValues.myVariable }}のために安全に見て、あなたが(ほぼ) ng-ifスコープの問題を忘れることができますので、それは、 MyValuesオブジェクトを見つけるまでの角度は $parentてフォールバックします。ネストされたコントローラにも同じことが適用されます。ここで

のベストプラクティスのこれらの種類に迅速に参照:learn-how-to-use-scopes-properly-in-angularjs

関連する問題