ホームページ > 記事 > ウェブフロントエンド > angularJS のスコープ_AngularJS についての簡単な説明
angularJS のスコープ_AngularJS についての簡単な説明
- WBOYオリジナル
- 2016-05-16 15:51:201018ブラウズ
<!doctype html>
<html ng-app="firstApp">
<head>
<meta charset="utf-8">
<script src="angular-1.3.0.js"></script>
</head>
<body>
<div ng-controller="parentCtrl">
<input ng-model="args">
<div ng-controller="childCtrl">
<input ng-model="args">
</div>
</div>
<script>
var app=angular.module('firstApp',[]);
app.controller('parentCtrl',function($scope) {
$scope.args = '123';
}).controller('childCtrl', function($scope) {
});
</script>
ケースの説明:
childCtrl には特定の args 属性が定義されていませんが、childCtrl のスコープはparentCtrl のスコープを継承するため、
したがって、childCtrl はプロトタイプを通じて親スコープの args プロパティにリンクされ、入力に設定されます。そして、親入力の入力値は自動的に子入力に同期されます
しかし、その逆は当てはまりません。つまり、子を変更しても親の値を変更することはできず、親が変更された後は子も同期しなくなります。その理由は、子スコープにコンテンツを入力するとき、
です。
HTML コード内のモデルは childCtrl のスコープに明示的にバインドされているため、AngularJS は childCtrl の args プリミティブ型属性を生成します。
AngularJS のスコープ継承プロトタイプ メカニズムに従って、childCtrl は独自のスコープ内で args 属性値を検索するため、親から args 値を検索しません。
その結果、子スコープにも親スコープにも引数があり、子と親の間の値は同期されなくなります。
以上がこの記事の全内容です。皆さんに気に入っていただければ幸いです。
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。