AngularJS Scope(作用域)
Scope(スコープ)は、HTML(ビュー)とJavaScript(コントローラー)の間の架け橋です。
Scopeはオブジェクトであり、利用可能なメソッドとプロパティを持っています。
Scopeはビューとコントローラーに適用できます。
Scopeの使い方
AngularJSでコントローラーを作成するとき、あなたは～できます。$scopeオブジェクトをパラメータとして渡す：
AngularJS 实例
コントローラーのプロパティは、ビューのプロパティに対応します：
<h1>{{carname}}</h1>
</div>
<script>
app.controller('myCtrl', function($scope) {
$scope.carname = "Volvo";
});
尝试一下 »
コントローラーに追加するとき$scopeオブジェクトの場合、ビュー(HTML)はこれらのプロパティを取得できます。
ビューでは、追加する必要はありません$scopeプレフィックスは、プロパティ名を追加するだけで済みます。例：{{carname}}。
Scope 概述
AngularJSアプリケーションの構成は次のとおりです：
- View(视图), 即 HTML。
- Model(モデル)、現在のビューで利用可能なデータ。
- Controller（コントローラー）、すなわち JavaScript 関数であり、プロパティを追加または変更することができます。
scopeはモデルです。
scopeはJavaScriptオブジェクトであり、プロパティとメソッドを備え、これらのプロパティとメソッドはビューとコントローラーで使用できます。
AngularJS 实例
ビューを変更すると、モデルとコントローラーもそれに応じて更新されます：
尝试一下 »
Scopeの作用範囲
現在使用しているscopeを理解することは非常に重要です。
上記の2つの例では、スコープは1つだけなので処理は比較的簡単ですが、大規模プロジェクトでは、HTML DOM内に複数のスコープが存在します。その場合、自分が使用しているスコープがどのスコープに対応するのかを知る必要があります。
AngularJS 实例
私たちが使用するときng-repeatディレクティブを使用する場合、各繰り返し項目は現在の繰り返しオブジェクトにアクセスします：
<ul>
<li ng-repeat="x in names">{{x}}</li>
</ul>
</div>
<script>
app.controller('myCtrl', function($scope) {
$scope.names = ["Emil", "Tobias", "Linus"];
});
尝试一下 »
每个<li>要素は現在の繰り返しオブジェクトにアクセスできます。ここでは文字列に対応し、変数を使用します。x表示。
根作用域
すべてのアプリケーションには$rootScope、それは...に作用できますng-appディレクティブに含まれるすべてのHTML要素内。
$rootScopeアプリケーション全体に作用できます。各controller内のscopeの架け橋です。rootscopeで定義した値は、各controllerで使用できます。
AngularJS 实例
コントローラーを作成するとき、$rootScopeをパラメータとして渡すと、アプリケーション内で使用できます：
<h1>{{lastname}}家族成员:</h1>
<ul>
<li ng-repeat="x in names">{{x}} {{lastname}}</li>
</ul>
</div>
<script>
app.controller('myCtrl', function($scope, $rootScope) {
$scope.names = ["Emil", "Tobias", "Linus"];
$rootScope.lastname = "Refsnes";
});
尝试一下 »