角度範囲
Angularで構築されたWebアプリケーションでは、範囲の概念がその全体にあります。 Angular Viewの多くの指示は、NG-APP、NG-Controllerなどのスコープを作成します。このスコープは$scope （Angular1.2の前のバージョン）です。ビューモデルの概念です。データモデルは範囲で定義されています。
角度スコープピット
Angularを使用した人は、プロセスを通過する必要があります。つまり、最初は初心者だったとき、データの双方向の結合を見ました。
スコープピット1の角度
彼がどのようにそれを直接使い始めたとしても、彼はそれを一度にバインドします。結合の後、運が良ければ（角度範囲の原理を理解している老鳥がそれを無視している場合）、双方向結合は期待どおりに機能し始めます。現時点では、私たちは非常に強力であるため、「双方向のバインディング」を非常に迅速に実現できると感じています。これは聞いていない新しい機能です。
それで、なぜ上記は幸運のために双方向の結合が適切に機能すると言っているのでしょうか？初心者が最初にAngularを学習し始めたとき、彼らはチュートリアルを読んで、コードを変更してビジネスニーズを達成するためです。最初に公式文書を学ぶことができるプレーヤーがいる場合でも、彼らはまだ少数です。したがって、Angularを学んだばかりの友人のほとんどは、実際に原則を理解していませんが、彼らはすでにそれらの使用方法を知っていると考えています。
多くのことを言った後、初心者が範囲内のデータモデルを指定し始めた状況を見て、双方向の方向にバインドしましょう。この場合、上記の落とし穴に遭遇します。最初にコードを見てみましょう。
// html <div ng-controller = "outerctrl"> <span ng-bind = "a"> </span> <div ng-controller = "innerctrl"> <span ng-bind = "a"> </span> < $ scope.a = 1;} function innerctrl（）{}上記のコードは、双方向結合の非常に簡単な例です。ページが読み込まれると、1が外部divおよび内部divに表示されます。増分ボタンを押すと、内部1のみが2になることがわかります。押し続ける場合も同じことが言えます。内部数のみが増加します。したがって、この時点で、初心者はしばしばパニックになります。合意された魔法の双方向の結合はどうですか？
角度のスコープピット2
この時点で、赤ちゃんは少し感情的でした。彼はstackoverflowと公式文書を歩いた。最後に、彼は実際に属性data.aを書くなどの解決策があることを発見しました。
// html <div ng-controller = "out outerctrl"> <span ng-bind = "data.a"> </span> <div ng-controller = "innerctrl"> <span ng-bind = "data.a"> </span> <button ng-click = "data.a = data.a+1" outerctrl（$ scope）{$ scope.data = {a：1};} function innerctrl（）{} {}それから私はそれが機能する可能性があることを発見し、両方の数字が増加しました。私は双方向のバインディングの王でした...そして、私はそれを脇に投げ、特定の原則を気にせずにチュートリアルの次の部分を学び続けました。これは実際に私が最初に角度を学んだときの私の精神的な旅です。内部原則を研究することを覚えていた前に、アプリケーションを行い、それを生産環境に展開することを本当に恥ずかしく思いました。
ピットは常に埋める必要があります
私はそんなにナンセンスを言って、ピットに足を踏み入れました。私はピット充填段階に入りました。つまり、このピットはオブジェクトとして記述された属性によって解決できることを意味します。実際、原則を知った後、理解しやすいです。 Angularの内側と外側の範囲は、JavaScriptに基づくプロトタイプチェーンによって継承され、プロトタイプチェーン継承方法のみが使用されます。いくつかのJavaScriptの基本を持っている友人は、即座に反応できるはずです。サブクラスのプロトタイプオブジェクトの参照型値と親インスタンスオブジェクトの参照タイプ値は同じ参照であり、基本型値は親オブジェクトの基本型値を上書きします。これが実際には、プロトタイプチェーンの継承を使用するだけで、少し広範囲に及ぶアピール問題をもたらすため、組み合わせの継承が存在する理由です。
要するに、ここで最初の例を次のように見ていきます。
function outerctrl（）{this.a = 1;} function innerctrl（）{} var outours = new out outourctrl（）; innerctrl.prototype = outer; var inenter = new innerctrl（）; inner.a = inner.a + 1;ここでは、内部コントローラーのコンストラクターのプロトタイプオブジェクトを外部スコープオブジェクトに設定し、生成された内部スコープオブジェクトが外部オブジェクトの外側のプロパティAを継承するようにします。このプロパティは基本的なタイプの値です。内部オブジェクトのプロパティAにアクセスする場合、内部オブジェクト自体にはそのような属性がないため、プロトタイプオブジェクトから調べます。プロトタイプオブジェクトの外側にはそのような属性があるため、返品値は問題ありませんが、内部スコープオブジェクトのプロパティAに値を割り当てると、問題が発生します。 inner.a = inner.a + 1;このステートメントは、実際に上記のプロセスを推進してAプロパティの値を見つけ、その後、返された値を内部スコープオブジェクトのAプロパティに割り当てます。 Aプロパティは存在しないため、Aの基本的なタイプの値プロパティが作成され、外側のスコープオブジェクトの外側のAプロパティがブロックされ、このピットが出てきます。
したがって、2つのオブジェクトの対応する属性が参照されているのと同じであるため、基本型値属性を参照型値属性に置き換えると、問題を解くことができます。
要約します
上記は、Angularで注意を払う必要がある落とし穴についてのすべてです。この記事の内容が、Angularの範囲について学ぶために誰にとっても役立つことを願っています。