問題タブ [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.

0 投票する
1 に答える
2305 参照

data-binding - AngularJS: 要素に ngModel とカスタム ディレクティブがある場合、双方向のデータ バインディングが失敗する

AngularJS でカスタム エラー メッセージを設定するために、次の 2 つのディレクティブを作成しました。

エラー -> フォームのエラー メッセージを表示します

error-message -> 入力にカスタム エラー メッセージを設定します

何らかの理由で、error-messageディレクティブを要素に追加するたびに、ng-model バインディングが機能しなくなります (ただし、検証は機能します)。

ここを参照してくださいhttp://jsfiddle.net/apohl/A8Vgk/111/

助けてください :)

0 投票する
2 に答える
4599 参照

angularjs - AngularJS - 要素に ng-class を設定しないディレクティブ スコープ

プランカー

私はデータのテーブルを持っています:

$scope.dndElemClass = 'on-drag-enter'私の目標は、要素のondragenterイベント リスナーに割り当てることによって、テーブルにドロップ シャドウを与えることです。

ディレクティブは次のonDragEnterとおりです。

およびイベント リスナーで$scope.dndElemClassの値を割り当てたにもかかわらず、 は値を認識せず、ドロップ シャドウが表示されないためクラスを割り当てていないようです。ondragenterondragleave<table>

これまでのところ、上記のコードで空白に割り当てられているディレクティブのコントローラー プロパティにクラスを設定すると値が認識されることをテストしたので、ディレクティブからそれを受け入れることがわかっています。テストとしてコントローラーに設定されたクラスで、ondragenterリスナーをトリガーすると、クラスが削除されます。$scope.$apply()がロギングでの値を適切に割り当てていることも確認しましたscope.dndElemClassが、何らかの理由で、イベント リスナーの に設定する$scope.$apply()と、テーブルのng-class属性が変数の割り当てを認識せず、空であると見なされます。


更新:$apply Josh のコメントに従って、イベント リスナーのコールバックで変数を割り当てる 必要がないように、コードをクリーンアップしました。

まだ運がありません。ロギングを使用してコールバックを実行していることを確認できますが、変数の割り当てがテーブルのng-class属性によって認識されることはありません。


更新 2: ngClass に関する AngularJS のドキュメントを 読んだ後、私はさらに混乱しています。私にとっては、現在のコントローラー(または私の場合はディレクティブ)の変数に必要なクラスの名前(配列内の名前)を設定するのと同じくらい簡単だと思いました$scope。次に、どこでもそうするようにその変数の名前を指定します要素のng-class=""属性のelse。しかし、私が読んでいるように、人々がを使用したり、クラス名を切り替えたりしているため、より複雑なようです。

トグルのアイデアを使用して、プランカーをフォークして、ユーザーがトリガーするか$scope.dndElemClassどうかに基づいて、状況設定をブール値に再作成しました。また、 overまたはの利点を理解していないことがわかったので、適切な測定のために含めました。いずれにせよ、これによってテーブルのクラスが期待どおりに設定されることはありませんでした。dragenterdragleave$scope.$apply()angular.bind().addEventListener.ondragenter = function() {};

0 投票する
3 に答える
22934 参照

angularjs - AngularJSで$broadcastイベントを停止する方法は?

$broadcastイベントがスコープチェーンを下るのを防ぐための組み込みの方法はありますか?

イベントによって渡されるイベントオブジェクトにはメソッド$broadcastがありません( $ rootScopeのドキュメントに記載されています)。ただし、このマージされたプルリクエストは、イベントがそれらを呼び出すことができることを示しています。stopPropagation$broadcaststopPropagation

0 投票する
1 に答える
7478 参照

angularjs - ng-styleがカスタムディレクティブと同じ要素で機能しないのはなぜですか?

ng-style属性をカスタムディレクティブタグに適用しようとしています。次のようなものです。

私が持っているコントローラーの中に:

しかし、これはうまくいかないようです。HTMLを検査すると、「MyStyle」がレンダリングされません。同じng-styleタグを通常のdivに適用すると、正しくレンダリングされます。

カスタムディレクティブタグでng-styleが機能しないのはなぜですか?

0 投票する
12 に答える
177528 参照

angularjs - AngularJS の外部 js 関数からのアクセス スコープ

外部JavaScript関数を介してコントローラーの内部スコープにアクセスする簡単な方法があるかどうかを確認しようとしています(ターゲットコントローラーとは完全に無関係です)

ここで他のいくつかの質問を見てきました

angular.element("#scope").scope();

DOM要素からスコープを取得しますが、私の試みは現在適切な結果をもたらしていません.

これがjsfiddleです:http://jsfiddle.net/sXkjc/5/

私は現在、プレーン JS から Angular への移行を行っています。これを達成しようとしている主な理由は、元のライブラリ コードを可能な限りそのままにしておくことです。各機能をコントローラーに追加する必要がなくなりました。

これを達成する方法についてのアイデアはありますか? 上記のフィドルに関するコメントも歓迎します。

0 投票する
1 に答える
46107 参照

angularjs - AngularJSはディレクティブテンプレートの$rootScope変数を評価します

入力フィールドを作成するディレクティブがあります。この入力フィールドのng-model属性を$rootScope変数の値に設定する必要があります。この背後にある理由は、入力フィールドをレイアウトに配置し、ロードされるページに応じて異なるモデルにバインドするためです。このグローバル変数を各コントローラーに設定し、ディレクティブでアクセスすると思いました。

変数がハードコーディングされているATM

そして指令

次のようにレンダリングされます

入力フィールド内のテキストはmymodel変数の値です。console.logは

誰かがこの問題に光を当ててくれませんか?

0 投票する
1 に答える
284 参照

javascript - 分離スコープを定義すると、ディレクティブの動作が変わります

javascriptグリッドライブラリslickgridのディレクティブがあります。

http://plnkr.co/edit/KWZ9i767ycz49hZZGswB?p=preview

私がやりたいのは、選択した行をコントローラーに戻すことです。したがって、('='を使用して)分離スコープを使用して、コントローラーとディレクティブの間で双方向バインディングを機能させたいと思います。

スコープ宣言を一切行わずにディレクティブを定義すると、すべてが機能します。

しかし、上記の行(app.jsの19〜21行目)のコメントを外すと、attrs.dataオブジェクトを監視している$scope。$watchがredrawを呼び出しているように見えますが、attrs.dataは未定義として渡されています。

私の分析は間違っている可能性がありますが、スコープを定義することがなぜこれを引き起こすのかわかりません。誰かがそれがなぜかもしれないのか説明できますか?

.nathan。

0 投票する
1 に答える
5022 参照

javascript - $resource get()によって設定されたAngularJSコントローラーの配列にアクセスするには?

AngularJS コントローラーで配列にアクセスできませんが、ビューでは機能します。

コントローラー内: .resultsundefined を返します

ビュー内:.resultsツイートの配列を返します

0 投票する
5 に答える
159404 参照

angularjs - AngularJS: モデル要素がモデル配列からスプライスされたときに ng-repeat リストが更新されない

2 つのコントローラーがあり、それらの間で app.factory 関数を使用してデータを共有しています。

最初のコントローラーは、リンクがクリックされると、モデル配列 (pluginsDisplayed) にウィジェットを追加します。ウィジェットが配列にプッシュされ、この変更がビューに反映されます (配列の内容を表示するために ng-repeat を使用します)。

ウィジェットは、k2plugin、remove、resize の 3 つのディレクティブに基づいて構築されています。remove ディレクティブは k2plugin ディレクティブのテンプレートにスパンを追加します。上記のスパンをクリックすると、共有配列の右側の要素が で削除されArray.splice()ます。共有配列は正しく更新されますが、変更はビューに反映されません。ただし、別の要素を追加すると、削除後にビューが正しく更新され、以前に削除された要素は表示されません。

私は何を間違えていますか?なぜこれがうまくいかないのか説明していただけますか?AngularJS でやろうとしていることを行うためのより良い方法はありますか?

これは私のindex.htmlです:

これは私のmain.jsです:

0 投票する
1 に答える
5860 参照

angularjs - テンプレート文字列で、ディレクティブが補間されていません

条件付きでテンプレートを作成しようとしています。いくつかのdivとspanを持つk2pluginディレクティブを取得しました。pluginui属性に従って、テンプレートの最後に別のディレクティブを挿入したいと思います。次の私のコードは、pluginui以外のすべてを補間します。たとえば、最後のdivは次のようになります。

{{pluginui}}はリテラルですが、他のディレクティブをトリガーするために補間する必要があります。面白いことに、同じ行の別の場所(たとえば、タグの間)に{{pluginui}}を配置すると、補間されます。

何が間違っているのですか?