問題タブ [angular-directive]

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 に答える
1157 参照

angularjs - ngModelController $modelValue はディレクティブの起動時に空です

次のような input=text タグで使用する属性ディレクティブがあります。

私のディレクティブでは、ngModelController を使用して、入力の初期値 (この場合はそれに関連付けられている ng-model の値) を保存しようとしています。

ディレクティブは次のようになります。

問題は、ディレクティブが初期化された時点で ngModel がまだ正しい値で更新されていなかったため、 ngModel.$modelValue が空である可能性があることです。では、入力フィールドに設定された最初の値をディレクティブに保存するにはどうすればよいでしょうか?

正しい値を持つように ngModel.$modelValue に正しくアクセスする方法は?

また、ドキュメントを読んでもこれが明確に理解できないため、これが機能しない理由についての説明をいただければ幸いです。

Plunkr の完全な例: http://plnkr.co/edit/QgRieF

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

javascript - angularJS ディレクティブ内の同じ ng-model を持つ複数の入力要素

値を直接入力するための入力フィールドを持つ範囲スライダーを作成したい (jQM のように: http://demos.jquerymobile.com/1.4.4/slider/ )。

私のディレクティブは次のようになります。

これは、数値入力の値を変更するときにうまく機能します。スライダーが移動し、両方の値属性が更新されます。スライダーを直接動かすとすぐに、両方の値属性が更新されますが、数値入力のテキストが何らかの理由でクリアされ、最小値に設定されます。

テンプレート内またはデータ バインディングで間違いを犯しましたか?

0 投票する
0 に答える
266 参照

javascript - angularで一般的および特定のディレクティブを作成する方法

Web アプリで何度も繰り返される一般的な「情報ボックス」を作成する必要があります。
このボックスには 3 つの異なるタイプ、たとえば A、B、C が必要です。
それらのテンプレートは非常に似ているため、「汎用ボックス」を作成し、ディレクティブが必要かどうかに応じて、何らかの方法でより具体的にすることを考えていました。 A、B、または C。

以下の画像を例に取りましょう。 ここに画像の説明を入力

緑色でマークされたスペースは、使用しているディレクティブに応じて存在する場合と存在しない場合があり、もちろんその内容と動作はそれに応じて変化するはずです。

ご覧のとおり、メイン ディレクティブは、左側の画像、タイトル、コンテンツ エリアなど、いくつかの基本的な繰り返し情報を含む単なる四角形です。

角度 (メインの四角形など) で汎用ディレクティブを作成し、ある種の継承を使用して「サブディレクティブ」を作成する方法はありますか?

はいの場合、メインディレクティブのみを使用し、それをパラメーターに渡して、そこからディレクティブ A、B、または C を作成する必要があるかどうかを angular に理解させることは可能ですか? 何かのようなもの

この手法の考えられる欠点は何ですか? 私は明確だったと思います

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

angularjs - ディレクティブに挿入されたサービスのAngularjs Uncaught ReferenceError

angularでまだ道を見つけていて、「.directive( 'y'、[y、function(y){」)の行で「Uncaught ReferenceError:yが定義されていません」というメッセージが表示されます。また、スクリプトをボディからヘッドに移動しようとしましたが、何もしません。

私のhtmlは

0 投票する
0 に答える
96 参照

javascript - AngularJSのディレクティブテンプレートの要素にディレクティブを渡す方法は?

と呼ばれるディレクティブがあります。step-fieldディレクティブのテンプレートには、場合によっては max-length または ng-required または のようなカスタム ディレクティブが必要な input または select 要素がありますvalidate-username

ステップ フィールドは次のようになります。

このディレクティブに「validate-username」と「required=true」を追加したいので、このようになります

そして、ディレクティブ テンプレートの内部で、validate-username が必要であり、入力フィールドに渡す必要があります。(ところで $scope.isRequired = attrs.required)

step-field に渡すディレクティブの一部をテンプレートの入力フィールドに適用するにはどうすればよいですか?

ありがとう!

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

angularjs - リソース呼び出しをディレクティブと統合するには?

基本的に、2 つのディレクティブがあります。

そしてコントローラー

JSONファイルを取得するための実装ですMap$resource

私の問題は、コントローラー呼び出しの前にディレクティブ機能が実行されていることです。つまりmapData、ディレクティブ内で のいくつかのプロパティを呼び出すと、それらはすべて undefined を返し、対応するエラー メッセージがコンソールに表示されます。ただし、エラー出力の直後に、$resource実装からのデータ フェッチが実行され、コンソールに出力されます。

を置き換えて$promise、のみに依存することに注意してください

次に、ディレクティブに$scope.mapData表示されますが、表示されません。<donut-chart><ng-map>

この種の構造を考えると、コントローラーがデータをロードするまでディレクティブ機能を遅らせるにはどうすればよいでしょうか?

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

javascript - 親スコープへのアクセスを維持しながら、カスタムディレクティブから要素属性にアクセスする方法は?

基本的に、作成したディレクティブの親スコープにアクセスできるようにしたいのですが、要素に配置した属性にもアクセスできるようにしたいと考えています。

たとえば、関連するjs

index.html

ディレクティブ.html

「Hello Henry」ではなく「Hello」が出力される

明確にするために、私ができるようにしたいのは、属性と親スコープにアクセスすることだけです。

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

javascript - AngularJS - Fn のリンクはディレクティブで何度も評価されます

私の質問はとてもシンプルで簡潔です。私のconsole.logアプリでは 50 回評価されますが、ここでは 2 回しか評価されません。

何が起こっている?

結びついていないとしても、サイクルに関連していると思います$digest()が、より明確な答えがあればいいでしょう。