0
私は何ヶ月もAngularJSで働いています。今日は、修正ヘッダをテーブルに追加するのに役立つ指令を作成する必要があります。私が見つけたすべてのディレクティブは、列のサイズを処理する方法のために十分ではありませんでした(私はまだ命題のために開かれています)。AngularJS:ディレクティブから生成されたデータにアクセスする方法は?
jQueryで作成された「古い」関数を使用していますが、これをディレクティブに変換しようとしています。目標は、表(または表のヘッダー)をクローンし、隠れ/表示機能とその良好な結果を得るための位置を扱うことです。
私の問題:私はそのようなもので、私のディレクティブで<th>
要素を取得しようとしている
<table>
<thead>
<tr>
<th></th> // true th elements, used for styling my table
<th></th>
<th class='text-center' ng-repeat="thing in things">
{{thing.label}}
</th>
</tr>
</thead>
<tbody>
// my tbody
</tbody>
</table>
:私のテーブルのヘッダが生成された列と動的である
angular.forEach(elem.querySelectorAll('tr:first-child th'), function (thElem, i) {
console.log(thElem)
// do stuff here
}
});
をしかし、私はちょうど私のコードの "真の"要素である最初の2つの<th>
を取得します。 ng-repeatによって生成される他のすべては無視されます。または私の指示に注入されません。
私はtransclude属性を見てきましたが、動作するものは見つかりませんでした。ある精度で私を助けることができますか?
編集:ここに私の指示の始まりです:
myApp.directive('fixMe', function ($window) {
return {
restrict: 'A',
link: function (scope, element, attrs) {
angular.forEach(element.querySelectorAll('th'), function (thElem, i) {
console.log(thElem);
var columnWidth = thElem.offsetWidth;
thElem.style.width = columnWidth + 'px';
});
}
};
})
私は理解してかはわからない - あなたは ''内のすべてのものを取ると、ディレクティブの内側にそれを置くことをしたいですか?コードをディレクティブテンプレートに入れることはできませんか? – Ozrix
+0
A
0
+0
+0
要素を複製します。配列内に3つの項目がある場合は、3つの というタグがthing.labelで作成されます。あなたは体のために同じことをすることができます、あなたも動的な行を持っているように。 –
fayzaan
0
関連する問題
-
1. AngularJsディレクティブ - ディレクティブ内から属性値を取得する方法
-
2. AngularJSネストされたディレクティブでの双方向データのバインド
-
3. AngularJS - ディレクティブのリンク関数で隔離されたスコープにアクセス
-
4. AngularJSディレクティブのグローバル変数にアクセスする方法
-
5. AngularJSディレクティブは、コントローラからのアクセスを属性にします。
-
6. AngularJSでディレクティブをリロードする方法は?
-
7. メソッドをディレクティブに渡してネストされたディレクティブにデータを渡す方法
-
8. AngularJS:親コントローラからのトランスコードされたディレクティブ内に配置されたフォームのアクセスformController
-
9. NSJSONSerializationから生成されたNSDictionary内のJSONデータにアクセスする
-
10. ng-repeat内のディレクティブからコントローラスコープにアクセスする方法は?
-
11. AsyncTaskで生成されたデータを保持する方法は?
-
12. Angularjs。ネストされたディレクティブの継承スコープ
-
13. ネイティブコードから生成されたAndroid Rクラスにアクセスする
-
14. jQuery .postから返されたJSONデータにアクセスする方法は?
-
15. 以前に送信されたフォームからPOSTデータにアクセスする方法
-
16. カーネルからユーザー空間で作成されたノードにアクセスする方法は?
-
17. アプリケーションから生成されたログを停止する方法
-
18. アクセス方法Angular2の親コンポーネントから渡された入力データ
-
19. postMessageで送信されたデータにアクセスする方法は?
-
20. erlangから生成されたハッシュされたパスワードを保存する方法
-
21. mysqlからデータにアクセスする方法
-
22. Vue.jsの深くネストされた子コンポーネントからデータにアクセスする方法
-
23. AngularJSで子スコープを作成するディレクティブ
-
24. AngularJSのコントローラー・ディレクティブのテスト方法
-
25. AngularJS - ディレクティブ
-
26. サーバから返されたJSONデータからJavaScriptオブジェクトを作成する方法
-
27. クリックボタンから手作業で作成されたテキストフィールド値にアクセスする方法
-
28. WCFでフィールドにアクセスする方法RIAで生成されたSilverlightアプリケーション
-
29. ウェブページから特定のデータを生成する方法は?
-
30. Angularjs:スコープ変数をディレクティブに渡す方法は?
最新の質問
-
1. Flux <DataBuffer>を解凍するにはどうすればいいですか?
-
2. クラスが `with`ステートメントのスコープを終了したときにタスクを実行するようにする
-
3. APIがApiControllerを認識しません
-
4. Pythonを使ったコーディングでのPassingCars
-
5. クラスインスタンスが配列に格納されている場合のクラス変数へのアクセス方法
-
6. javascriptリダイレクトされたURLへのAPI呼び出しでjsonデータを取得する方法
-
7. は、私は次のような単純な最小二乗目的関数を最適化するためにtensorflowを使用しています
-
8. Djangoのテスト - 今後の使用
-
9. Sklearn VotingClassifierの使い方はどのような方法ですか?
-
10. Perl:作成された順にハッシュ値を取得する
-
1. AngularJsディレクティブ - ディレクティブ内から属性値を取得する方法
-
2. AngularJSネストされたディレクティブでの双方向データのバインド
-
3. AngularJS - ディレクティブのリンク関数で隔離されたスコープにアクセス
-
4. AngularJSディレクティブのグローバル変数にアクセスする方法
-
5. AngularJSディレクティブは、コントローラからのアクセスを属性にします。
-
6. AngularJSでディレクティブをリロードする方法は?
-
7. メソッドをディレクティブに渡してネストされたディレクティブにデータを渡す方法
-
8. AngularJS:親コントローラからのトランスコードされたディレクティブ内に配置されたフォームのアクセスformController
-
9. NSJSONSerializationから生成されたNSDictionary内のJSONデータにアクセスする
-
10. ng-repeat内のディレクティブからコントローラスコープにアクセスする方法は?
私の目標は、(行数、列数などに関係なく)どのテーブルでも動作する命令を持つことです。テンプレートでそれを行うことはできますか? – Thib
答えて
ご使用NGリピートするので、あなたは一意のIDを追加し、要素を取得するためにバニラのJSを使用することができます。
あなたが何をしたいかによって、クリック時の変更を処理したい場合は、ng-clickを使用して関数を使用して要素を取得することもできます。ng-click = " doSomething($ event) "となります。
出典
2016-04-27 23:06:34 fayzaan
私が前のコメントで言ったように、私の目標は、どのテーブルでも動作するような指示文を作成することです。私は範囲に頼ることができない、私は? – Thib
ng-repeatを使用すると、どのテーブルでも動作するように動的になります。 ng-repeatは、配列の最後まで
は、私はまだわからないので、これはあなたが望むものであるならば、ここに野生の推測を取るつもりですが、要素の任意の集合を得るために、あなたはトランスクルー使用できます。
をDemo(コンソールログをチェックし、動的に
<th>
要素はtr.scope.cells
オブジェクトに含まれる)出典
2016-04-28 09:18:31 Ozrix
関連する問題