タグ付けされた質問 「angularjs-directive」

このトピックに関するAngularJSのドキュメントを注意深く読み、次にディレクティブをいじっています。こちらがフィドルです。 そしてここにいくつかの関連するスニペットがあります： HTMLから： <pane bi-title="title" title="{{title}}">{{text}}</pane> ペインディレクティブから： scope: { biTitle: '=', title: '@', bar: '=' }, 取得できないことがいくつかあります。 なぜ"{{title}}"with '@'と"title"一緒に使用する必要があるの'='ですか？ 要素を属性で装飾せずに、親スコープに直接アクセスすることもできますか？ ドキュメントには、「式を介して分離されたスコープから親スコープにデータを渡すことが望ましい場合が多い」とありますが、双方向バインディングでもうまく機能するようです。なぜ発現経路の方が良いのでしょうか？ 式の解決策を示す別のフィドルも見つけました：http : //jsfiddle.net/maxisam/QrCXh/

1067 angularjs  angularjs-directive  angularjs-scope  isolated-scope 

AngularJSの入力フィールドにフォーカスを設定する「Angularの方法」とは何ですか？ より具体的な要件： モーダルを開いたら、<input>このモーダル内の事前定義されたものにフォーカスを設定します。 <input>ボタンがクリックされるなどして表示されるたびに、フォーカスを合わせます。 私は、最初の要件を達成しようとしたとしautofocusますが、これはモーダルが初めて開かれ、唯一の特定のブラウザで（Firefoxでそれが動作しないなど）ときにのみ機能します。 どんな助けでもありがたいです。

759 angularjs  angularjs-directive 

ディレクティブを作成すると、コードをコンパイラー、リンク関数、またはコントローラーに配置できます。 ドキュメントでは、彼らはそれを説明しています： コンパイルおよびリンク機能は、角サイクルのさまざまなフェーズで使用されます コントローラーはディレクティブ間で共有されます ただし、私にとっては、どの種類のコードをどこに配置すればよいかは明らかではありません。 例：コンパイルで関数を作成し、それらをリンクのスコープにアタッチすることや、コントローラーのスコープに関数のみをアタッチすることはできますか？ 各ディレクティブが独自のコントローラーを持つことができる場合、コントローラーはディレクティブ間でどのように共有されますか？コントローラは本当に共有されているのですか、それともスコープのプロパティだけですか？

529 angularjs  angularjs-directive 

私がいることを理解ng-showし、ng-hide要素のクラス集合とその影響を与えるng-if要素はDOMの一部としてレンダリングされているかどうかを制御します。 選択のガイドラインがあるng-ifオーバーng-show/ ng-hideまたはその逆は？

516 angularjs  angularjs-directive 

閉まっている。この質問はスタックオーバーフローのガイドラインを満たしていません。現在、回答を受け付けていません。 この質問を改善してみませんか？ Stack Overflowのトピックとなるように質問を更新します。 5年前休業。 Angularディレクティブを記述する場合、次の関数のいずれかを使用して、DOMの動作、コンテンツ、およびディレクティブが宣言されている要素の外観を操作できます。 コンパイル コントローラ プレリンク ポストリンク どの関数を使用するべきかについては、いくつかの混乱があるようです。この質問の対象は次のとおりです。 ディレクティブの基本 さまざまな関数を宣言する方法は？ ソーステンプレートとインスタンステンプレートの違いは何ですか？ ディレクティブ関数はどの順序で実行されますか？ これらの関数呼び出しの間で他に何が起こりますか？ 関数の性質、すべきこと、すべきでないこと コンパイル コントローラ プレリンク ポストリンク 関連する質問： 指令：コントローラ対コンパイル対リンク。 angular.jsディレクティブを定義するときの「コントローラー」、「リンク」、および「コンパイル」関数の違い。 angularjsでのコンパイルとリンクの機能の違いは何ですか。 AngularJSディレクティブのプリコンパイル要素とポストコンパイル要素の違いは何ですか？。 Angular JSディレクティブ-テンプレート、コンパイル、またはリンク？。 Angular jsディレクティブのリンク後とリンク前。

451 angularjs  angularjs-directive 

下のテキストボックスでEnterキーを押すイベントをキャッチします。より明確にするためにng-repeat、tbodyに値を設定するためにを使用しています。HTMLは次のとおりです。 <td><input type="number" id="closeqty{{$index}}" class="pagination-right closefield" data-ng-model="closeqtymodel" data-ng-change="change($index)" required placeholder="{{item.closeMeasure}}" /></td> これは私のモジュールです： angular.module('components', ['ngResource']); リソースを使用してテーブルにデータを入力していますが、コントローラーコードは次のとおりです。 function Ajaxy($scope, $resource) { //controller which has resource to populate the table }

410 angularjs  angularjs-directive  angular-ui 

ディレクティブ内の「親」スコープにアクセスする方法を探しています。スコープ、トランスクルード、要求、変数（またはスコープ自体）を上から渡すなど、どのような組み合わせでもかまいません。完全に逆方向に曲がってもかまいませんが、完全にハックされたものやメンテナンス不可能なものは避けたいです。たとえば$scope、preLinkパラメータからを取得し、その$siblingスコープを反復して概念的な「親」を見つけることで、今すぐ実行できることを知っています。 私が本当に望んでいるのは$watch、親スコープで式を表現できるようにすることです。私がそれを行うことができる場合、私はここで私がやろうとしていることを達成できます： AngularJS-変数を使用してパーシャルをレンダリングする方法？ 重要な注意点は、ディレクティブは同じ親スコープ内で再利用可能でなければならないということです。したがって、デフォルトの動作（スコープ：false）は機能しません。ディレクティブのインスタンスごとに個別のスコープが必要です。次に$watch、親スコープに存在する変数が必要です。 コードサンプルは1000ワードに相当するので、 app.directive('watchingMyParentScope', function() { return { require: /* ? */, scope: /* ? */, transclude: /* ? */, controller: /* ? */, compile: function(el,attr,trans) { // Can I get the $parent from the transclusion function somehow? return { pre: function($s, $e, $a, parentControl) { // Can …

327 angularjs  angularjs-directive 

アイテムのブートストラップにナビゲーションバーがある場合 Home | About | Contact 各メニュー項目がアクティブなときに、それらのアクティブクラスをどのように設定しますか？つまりclass="active"、角度ルートが #/ 家のために #/about アバウトページについて #/contact お問い合わせページ

306 javascript  twitter-bootstrap  angularjs  angularjs-directive  navbar 

私はディレクティブを持っています、これがコードです： .directive('map', function() { return { restrict: 'E', replace: true, template: '<div></div>', link: function($scope, element, attrs) { var center = new google.maps.LatLng(50.1, 14.4); $scope.map_options = { zoom: 14, center: center, mapTypeId: google.maps.MapTypeId.ROADMAP }; // create map var map = new google.maps.Map(document.getElementById(attrs.id), $scope.map_options); var dirService= new google.maps.DirectionsService(); var dirRenderer= new google.maps.DirectionsRenderer() …

297 angularjs  angularjs-directive 

スコープのブール変数に基づいて、たとえば「contenteditable」を要素に追加できるようにする必要があります。 使用例： <h1 attrs="{'contenteditable=\"true\"': editMode}">{{content.title}}</h1> $scope.editModeに設定されてtrueいる場合、要素にcontenteditable = trueが追加されます。このng-classのような属性動作を実装する簡単な方法はありますか？ディレクティブを書いて、そうでない場合は共有することを検討しています。 編集： 私が提案したattrsディレクティブとng-bind-attrsの間にいくつかの類似点があるように見えますが、それは1.0.0.rc3で削除されました、なぜそうですか？

296 angularjs  angularjs-directive 

私はこのように私の問題を処理しています： ng-style="{ width: getTheValue() }" しかし、コントローラー側でこの機能を使用しないようにするために、私は次のようなことをしたいと思います： ng-style="{ width: myObject.value == 'ok' ? '100%' : '0%' }" これどうやってするの？

267 angularjs  angularjs-directive 

StackOverflowでng-transcludeについて議論する多くの質問を見てきましたが、それが何であるかを素人の言葉で説明するものはありません。 ドキュメントの説明は次のとおりです。 トランスクルージョンを使用する最も近い親ディレクティブの隠されたDOMの挿入ポイントをマークするディレクティブ。 これはかなり混乱します。誰かが簡単な言葉でng-transcludeが何をするつもりで、どこでそれが使われるのかを説明できるでしょうか？

266 angularjs  angularjs-directive  transclusion 

新しいディレクティブを作成するときに使用するスコープのタイプを決定するのに役立つガイドラインを探しています。理想的には、一連の質問を案内して正しい答えを表示するフローチャートに似たものを望みます。新しい新しいスコープ、新しい子スコープ、または新しい分離スコープはありませんが、多すぎると思われます。これが私の現在のちょっとしたガイドラインです： ディレクティブを使用する要素がng-model を使用する場合は分離スコープを使用しないでください。分離スコープでng-model を使用できますか？を参照してください。そして なぜフォーマッタは孤立範囲では動作しませんか？ ディレクティブがスコープ/モデルプロパティを変更しない場合は、新しいスコープを作成しないでください ディレクティブが一連のDOM要素をカプセル化している場合、分離スコープはうまく機能するようです（ドキュメントは「複雑なDOM構造」と記載されている）、ディレクティブが要素として使用される場合、または同じ要素に他のディレクティブがない。 要素に分離スコープを持つディレクティブを使用すると、同じ要素の他のすべてのディレクティブが同じ（1）分離スコープを使用するように強制されるので、分離スコープを使用できる場合、これは厳しく制限されませんか？ Angular-UIチームのメンバー（または多くのディレクティブを作成した他のチーム）が経験を共有できることを願っています。 「再利用可能なコンポーネントには分離されたスコープを使用する」という単純な答えを追加しないでください。

265 angularjs  angularjs-directive  angularjs-scope 

src変数からiframe の属性を設定しようとしていますが、機能させることができません... マークアップ： <div class="col-xs-12" ng-controller="AppCtrl"> <ul class=""> <li ng-repeat="project in projects"> <a ng-click="setProject(project.id)" href="">{{project.url}}</a> </li> </ul> <iframe ng-src="{{trustSrc(currentProject.url)}}"> Something wrong... </iframe> </div> controllers / app.js： function AppCtrl ($scope) { $scope.projects = { 1 : { "id" : 1, "name" : "Mela Sarkar", "url" : "http://blabla.com", "description" : "A professional …

214 javascript  html  angularjs  iframe  angularjs-directive 

私は私がやっていることの問題を非常に煮詰めたバージョンを持っています。 シンプルdirectiveです。要素をクリックすると、別の要素が追加されます。ただし、正しくレンダリングするには、最初にコンパイルする必要があります。 私の研究は私を導いた$compile。しかし、すべての例は複雑な構造を使用しているので、ここでどのように適用すればよいのか本当にわかりません。 フィドルはこちら：http ://jsfiddle.net/paulocoelho/fBjbP/1/ そしてJSはここにあります： var module = angular.module('testApp', []) .directive('test', function () { return { restrict: 'E', template: '<p>{{text}}</p>', scope: { text: '@text' }, link:function(scope,element){ $( element ).click(function(){ // TODO: This does not do what it's supposed to :( $(this).parent().append("<test text='n'></test>"); }); } }; }); Josh David Millerによるソリューション：http …

212 angularjs  angularjs-directive  dynamically-generated