問題タブ [angularjs-scope]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
javascript - ng-includeを使用するとスコープが失われます
私はこのモジュールルートを持っています:
ホームHTML:
partial1
HTML:
HomeCtrl
:
addLine
関数$scope.lineText
isで、これはundefined
に追加ng-controller="HomeCtrl"
することで解決できますpartial1.html
が、コントローラーが2回呼び出されます。ここで何が欠けていますか?
angularjs - 「this」と AngularJS コントローラーの $scope
AngularJS のホームページの「コンポーネントの作成」セクションに、次の例があります。
select
メソッドが に追加されていることに注意してください。$scope
ただし、addPane
メソッドは に追加されていthis
ます。に変更すると$scope.addPane
、コードが壊れます。
ドキュメントには、実際には違いがあると書かれていますが、違いについては言及されていません。
Angular の以前のバージョン (1.0 RC より前) では
this
、メソッドと同じ意味で使用でき$scope
ましたが、現在はそうではありません。this
スコープで定義されたメソッドの内部で$scope
交換可能 (angular をthis
に設定$scope
) ですが、それ以外の場合はコントローラー コンストラクター内ではできません。
AngularJS コントローラーでどのようthis
に機能しますか?$scope
javascript - AngularJSで双方向フィルタリングを行う方法は?
AngularJSが実行できる興味深いことの1つは、特定のデータバインディング式にフィルターを適用することです。これは、たとえば、モデルのプロパティのカルチャ固有の通貨や日付の書式設定を適用するための便利な方法です。スコープに計算されたプロパティがあるのも良いことです。問題は、これらの機能のどちらも双方向のデータバインディングシナリオでは機能しないことです。スコープからビューへの双方向のデータバインディングのみです。これは、他の点では優れたライブラリの明白な省略のようです-または私は何かを逃していますか?
KnockoutJSでは、読み取り/書き込み計算プロパティを作成できます。これにより、プロパティの値を取得するために呼び出される関数と、プロパティが設定されたときに呼び出される関数のペアを指定できます。これにより、たとえば、カルチャ対応の入力を実装できました。ユーザーが「$ 1.24」と入力し、それをViewModelのfloatに解析して、ViewModelの変更を入力に反映させることができます。
これに似たものを見つけることができる最も近いものは、これを使用する$scope.$watch(propertyName, functionOrNGExpression);
ことです。これにより、プロパティの変更時に関数を呼び出すことができます$scope
。しかし、これは、たとえば、カルチャを意識した入力の問題を解決するものではありません。メソッド自体の$watched
中でプロパティを変更しようとすると、問題に注意してください。$watch
(http://jsfiddle.net/gyZH8/2/)
ユーザーが入力を開始すると、入力要素は非常に混乱します。プロパティを2つのプロパティに分割することで改善しました。1つは未解析の値用で、もう1つは解析済みの値用です。
(http://jsfiddle.net/XkPNv/1/)
これは最初のバージョンからの改善でしたが、もう少し冗長でありparsedValue
、スコープ変更のプロパティの問題がまだあることに注意してください(2番目の入力に何かを入力すると、parsedValue
直接変更されます。上部の入力は変更されないことに注意してください)アップデート)。これは、コントローラーのアクションまたはデータサービスからのデータのロードから発生する可能性があります。
AngularJSを使用してこのシナリオを実装する簡単な方法はありますか?ドキュメントにいくつかの機能がありませんか?
angularjs - 親スコープを指定して、Angularjs のすべての子スコープを取得する
親スコープを指定して、すべての子スコープのリストを取得する方法を知りたいです。スコープのプロパティから見つけられるのは、$$childHead、$$childTail、$$nextSibling、および $$prevSibling だけです。
私が現在使用しているアプローチは、親から childHead を取得し、次に nextSibling を使用して、nextSibling が null になるまで次の子を取得することです。
より良いアプローチはありますか?すべての子に対してメソッド [getModel] を呼び出したい場合、これを行うためのより良い方法はありますか?
angularjs - AngularJS : $scope.$apply() の呼び出し時にエラー $digest already in progress を回避
angularでアプリケーションを構築して以来、自分のページをスコープに合わせて手動で更新する必要があることがわかりました。
$apply()
これを行う唯一の方法は、コントローラーとディレクティブのスコープから呼び出すことです。これに関する問題は、次のようなエラーをコンソールにスローし続けることです。
エラー: $digest は既に進行中です
このエラーを回避する方法、または同じことを別の方法で達成する方法を知っている人はいますか?
angularjs - AngularJSを使用してブラウザのコンソールで$scope変数にアクセスするにはどうすればよいですか?
$scope
ChromeのJavaScriptコンソールで変数にアクセスしたいと思います。それ、どうやったら出来るの?
コンソール$scope
にモジュールの名前も変数として表示されません。myapp
angularjs - ディレクティブスコープのrootscope変数にアクセスできません
以下の関数は、ルートスコープで変数を定義します。
以下のディレクティブのhtmlは、ルートスコープの変数に依存します-
ただし、上記のコードは機能しません。ディレクティブスコープで'buttons'変数を直接定義すると機能します。
angularjs - AngularJSのディレクティブスコープの「@」と「=」の違いは何ですか?
このトピックに関するAngularJSのドキュメントを注意深く読んだ後、ディレクティブをいじりました。これがフィドルです。
そして、ここにいくつかの関連するスニペットがあります:
HTMLから:
/li>ペインディレクティブから:
/li>
私が得られないことがいくつかあります:
- と
"{{title}}"
一緒に使用する必要があるのはなぜですか?'@'
"title"
'='
- 要素を属性で装飾せずに、親スコープに直接アクセスすることもできますか?
- ドキュメントには、「分離されたスコープから式を介して親スコープにデータを渡すことが望ましい場合が多い」と記載されていますが、双方向バインディングでも問題なく機能するようです。なぜ表現ルートが良いのでしょうか?
式の解決策を示す別のフィドルも見つけました:http://jsfiddle.net/maxisam/QrCXh/
angularjs - フォーマッターが分離スコープで機能しないのはなぜですか?
フォーマッターが分離スコープで機能しないのはなぜですか? これは角度のあるバグですか、それとも何か間違っていますか?
これには分離スコープが含まれており、機能しません: http://jsfiddle.net/YbdXQ/56/
これには分離が含まれておらず、スコープは正常に機能します: http://jsfiddle.net/YbdXQ/57/
angularjs - AngularJSでディレクティブを作成する場合、新しいスコープ、新しい子スコープ、または新しい分離スコープが必要かどうかを判断するにはどうすればよいですか?
新しいディレクティブを作成するときに使用するスコープのタイプを決定するのに役立つガイドラインを探しています。理想的には、一連の質問を案内し、正しい答えをポップアウトするフローチャートに似たものが欲しいです。新しいスコープ、新しい子スコープ、または新しい分離スコープはありませんが、それは多すぎることを求めている可能性があります。これが私の現在のガイドラインのセットです:
- ディレクティブを使用する要素がng-modelを使用する場合は、分離スコープを使用しないでください。「分離スコープで
ng-modelを使用できますか?
」を参照してください。フォーマッタが分離スコープで機能しないのはなぜですか?
- ディレクティブがスコープ/モデルのプロパティを変更しない場合は、新しいスコープを作成しないでください
- ディレクティブがDOM要素のセットをカプセル化していて(ドキュメントには「複雑なDOM構造」と記載されています)、ディレクティブが要素として使用される場合、または同じ要素に他のディレクティブがない場合は、スコープの分離が適切に機能するようです。
要素に分離スコープを持つディレクティブを使用すると、同じ要素上の他のすべてのディレクティブが同じ(1つの)分離スコープを使用するように強制されることを知っています。したがって、分離スコープを使用できる場合、これは厳しく制限されませんか?
Angular-UIチームの一部(または多くのディレクティブを作成した他のチーム)が彼らの経験を共有できることを願っています。
「再利用可能なコンポーネントには分離されたスコープを使用する」という単純な回答を追加しないでください。