問題タブ [angularjs-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 投票する
2 に答える
189 参照

angularjs - 関数を呼び出してディレクティブの値を変更するにはどうすればよいですか?

このようなものが必要ですが、機能しません

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

angularjs - 再利用可能なAngularJsコンポーネントを作成する方法

これは簡単なはずですが、ドキュメントが見つかりません。Angularコンポーネント(フィルターなど)をさまざまなアプリで再利用できるようにする方法を考えています。電話番号をフォーマットする簡単なフィルターを作成しました。どのアプリでも使用できるようにしたいと思います。現在、次のように宣言されています。

問題は、このフィルターを再利用可能にする方法です。現在、「myModule」にアタッチされているだけですが、このファイルから取り出して、他の場所でも再利用できるようにするにはどうすればよいですか?

0 投票する
4 に答える
52042 参照

angularjs - 内部ディレクティブから ngChange イベント呼び出しに引数を渡す

ng-change属性を受け入れるディレクティブがあります。

コントローラーでmyCallback次のような関数を定義しました。

次の関数 select は、私のradioButtonディレクティブ内に存在します。select 関数のディレクティブ内で ngChange コールバックがいつ実行されるかを定義する必要があります。

私が抱えている問題は、ディレクティブの関数内で実行するときに引数$eventmyCallback渡されないことです。myCallbackselect

フィドル: http://jsfiddle.net/dkrotts/BtrZH/7/更新: http://jsfiddle.net/dkrotts/BtrZH/8/

私は何を間違っていますか?

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

javascript - AngularJSファイルのドラッグアンドドロップインディレクティブ

この例は、Angular-jsに移植したいことをほぼ実行します:HTML5FileAPI

私はディレクティブのいくつかの例をグーグルで検索しようとしましたが、DOMを大量に使用するか、Angular1.0.4用に作成されていない古い例を見つけました。

基本的にこれは純粋なjsコードです:

私が考えることができる唯一の可能な方法は、

ただし、(1)機能しなかった、(2)修正する前に、何かが存在するかどうか、または適切に実行しているかどうかを知りたいのですが、

ヒントやヘルプは大歓迎です。

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

angularjs - コントローラーなしでサービス結果を反復処理するディレクティブ

Web コンポーネントを宣言的に定義するためのフレームワークとして AngularJS を使用する可能性を調査しています (コントローラーの必要性を可能な限り回避します)。必要な機能の大部分は、Angular の組み込みディレクティブで既に実現できますが、データを非同期に要求するために使用されるさまざまなサービスの結果を反復できるようにしたいと考えています。

必要な機能は、サービスをコントローラーに挿入し、結果をスコープに保存することで簡単に実現できますが、コントローラーをまったく必要とせずにこれを実現する方法があることを望んでいました (具体的には、手書きではなくテンプレート)。

Angular でこれを実現する組み込みの方法はありますか (たとえば、サービス呼び出しを繰り返し式に含める方法など)? そうでない場合、これを達成するための最も効果的な方法は何ですか? サービスへの参照を取得する新しいディレクティブを作成できるはずだと思いますが、これがこれを達成する正しい方法であるかどうかはわかりません。

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

javascript - カスタム入力タイプを作成するには?

たとえば、AngularJS が「メール」を実装する方法と同様のカスタム入力タイプを作成したいと思います。

私が作成したいのは、次のような入力タイプです。

これをどのように達成できるかについてのアイデアはありますか? これまでのところ、'path' がタグ、属性、またはクラスの名前であるカスタム ディレクティブを実装する方法しか理解できていません。

たとえば、これを機能させることはできますが、他のフォーム フィールドと一貫性がなく、同じように見せたいと思っています。

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

javascript - AngularJS: $scope をディレクティブに渡す

jQuery File Upload プラグインとこ​​のディレクティブの要点を使用してファイル アップロード ディレクティブを作成しようとしていますhttps://gist.github.com/thoughtpalette/4726114

profile-ctrl.js のオブジェクトの ID をアップロード フォームの送信機能に渡す必要があります。

私のディレクティブはコントローラーの外側にあり、オブジェクトを $rootScope に設定して、ディレクティブでキャッチ/パスすることができませんでした。

url: in fileupload で魔法が起こります。API を介してコントローラーを呼び出し、ファイル情報と、できれば profile-ctrl.js のマーチャント オブジェクトにある vendorId を渡します。$scope.merchant

残念ながらプロジェクトの構造上、フィドルに投稿できません

私の指令:

HTML 経由のディレクティブ呼び出し:

したがって、現在、マーチャントはディレクティブで未定義を返します。誰かがそれを渡すのを手伝ってくれますか?

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

angularjs - 「ng-switch」を実行するとイベントがキャッチされなくなるのはなぜですか

ファイルのアップロード中に( を介して) イベントを発生させるファイル アップロード ディレクティブがあります。これは、進行状況バーを更新するためscope.$emitにコントローラーで ( を介して) キャッチされます。scope.$onファイル アップロード ディレクティブはng-switch-ed アウトされるため、ユーザーはファイルのアップロード中にファイルに関するその他の情報を入力できます。彼らがこれをしている間、プログレスバーが更新され続けることを望みます。これはバージョン 1.0.2 では問題なく動作していましたが、1.0.4 では壊れているようです。

私が作成した jsFiddleは大幅に単純化されていますが、問題が示されています。ページが最初に読み込まれると、ディレクティブからイベントが発生し、コントローラーでキャッチされ、すべてが期待どおりに更新されます。ただし、ディレクティブがng-switch削除されるようにドロップダウンを変更すると、イベントが捕捉されなくなります。コンソールを見ると、イベントはまだ取得$emit中ですが、コントローラーはそれをキャッチしなくなります。(http://jsfiddle.net/uysAM/1/ )に置いても$on、まだ同じ問題があります。イベントがまだ処理されている場合、なぜスコープはそれをキャッチしなくなるのでしょうか?$rootScope$emit

上部のタグの src を<script>1.0.2 を使用するように変更すると、問題なく動作します。これは最新バージョンの新しいバグですか? 助けてくれてありがとう。

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

angularjs - AngularJSのディレクティブでコントローラーを割り当てて使用する適切な方法

2つのディレクティブが相互に通信できるように、コントローラーをディレクティブに正しく割り当てる方法。2番目のディレクティブのrequire引数を最初のディレクティブの名前に設定すると、コンソールでエラーが発生します。

エラー:コントローラーなし:ノードリンクFn(http:// ajax)のgetControllers(http://ajax.googleapis.com/ajax/libs/angularjs/1.0.4/angular.js:4132:19)エラー()でdir googleapis.com/ajax/libs/angularjs/1.0.4/angular.js:4259:35)compositeLinkFn(http://ajax.googleapis.com/ajax/libs/angularjs/1.0.4/angular.js:3869 _ _ :15) at CompositeLinkFn( http://ajax.googleapis.com/ajax/libs/angularjs/1.0.4/angular.js:3872:13)at nodeLinkFn(http://ajax.googleapis.com/ajax/libs /angularjs/1.0.4/angular.js:4252:24)at CompositeLinkFnhttp://ajax.googleapis.com/ajax/libs/angularjs/1.0.4/angular.js:3869:15)at CompositeLinkFn(http://ajax.googleapis.com/ajax/libs/angularjs/1.0.4/angular.js:3872:13)publicLinkFn(http://ajax.googleapis.com/ajax/libs/angularjs/1.0.4 _ _ /angular.js:3775:30)http://ajax.googleapis.com/ajax/libs/angularjs/1.0.4/angular.js:934:25angular.js:5601 _ _ <div class="btn btn-danger" dir2=""> _

(無名関数)angular.js:5601

(無名関数)angular.js:4698

nodeLinkFnangular.js:4261

CompositeLinkFnangular.js:3869

CompositeLinkFnangular.js:3872

nodeLinkFnangular.js:4252

CompositeLinkFnangular.js:3869

CompositeLinkFnangular.js:3872

publicLinkFnangular.js:3775

(無名関数)angular.js:934

Scope。$evalangular.js:7905

Scope。$applyangular.js:7985

(無名関数)angular.js:932

invokeangular.js:2813

bootstrapangular.js:930

angleInitangular.js:906

(無名関数)angular.js:14600

cjquery-latest.min.js:3

p.fireWithjquery-latest.min.js:3

b.extend.readyjquery-latest.min.js:3

H

これがplnkrの例です。

編集 :

多くのウェブサイトに存在する何かをしようとしています。ボタンをクリックするか、リストビューからサムネイルビューなどにリンクしてビューテンプレートを変更します。ボタンスイッチャーと、ビューの「切り替え可能ビュー」と呼ばれるもう1つ。これがサンプルコード付きのplnkrです。「switcher」ディレクティブをクリックすると、切り替え可能なディレクティブのテンプレートが切り替わり、ビューが切り替わるという考え方です。これが十分に明確であることを願っています。私がやろうとしているのはこのplnkrのようなものです

前もって感謝します。

0 投票する
8 に答える
39857 参照

unit-testing - Jasmine は templateUrl を使用して AngularJS ディレクティブをテストします

Jasmine で AngularJS のディレクティブ テストを作成し、templateUrl を使用しています: https://gist.github.com/tanepiper/62bd10125e8408def5cc

ただし、テストを実行すると、要点に含まれるエラーが表示されます。

ドキュメントで読んだことから、これを正しく行っていると思いましたが、そうではないようです-ここで何が欠けていますか?

ありがとう