以下に、angularjs を使用してテーブルに tr を追加する方法に関する記事を紹介します。これは参考になるので、皆さんのお役に立てれば幸いです。
要件:
上記は
ログイン後にコピーループ表示を使用した表です。現在の要件の 1 つは、フィールドを各行に追加する必要があることですが、同じ行に表示することはできず、次の行に表示する必要があります。最初は直接追加することを考えましたが、行を変更する方法がありませんでした。以下に別のものを追加することはできません。信頼できるのは強力な angulaj とカスタム命令のみです。始めましょう。
1 カスタム指示
.directive( 'kbnTableRow', function($compile) { return { restrict : 'A', link : function(scope, element) { element.after(''); function expressDescHtml() { var detailHtml = ' ' + ' '; return detailHtml; } }, templateUrl : 'libs/kbnTable/table_row/rule.html' }; });' + '
' + ' ' + '
' +'' + 'ログイン後にコピー2 rules.html はオリジナルのコンテンツです
{{$index+1}}
   {{rule.rightVar.desc}}
ログイン後にコピー変更する必要はありません、オリジナルとはここに書かれている内容です。
3 最初のページの tr ループ部分を新しいコマンドで書き換えます:
表达式设置
序号 左变量 操作符 右变量 分值 操作
ログイン後にコピーこの方法で初期要件を完了できますが、上記のわずかな変更でより良い機能を実現できます。次のようになります。自動的に縮小:
上記は私が皆さんのためにまとめたもので、将来皆さんのお役に立てば幸いです。
関連記事:
Vue で親子コンポーネントのデータ転送、変更、更新を実装する方法 (詳細なチュートリアル)
vue2.0 子コンポーネントで props 値の変更を実装し、それらを渡す方法親コンポーネントの値
vue で単一コンポーネントのデータを動的に変更するときにすべての再レンダリングを実装する方法
以上がangularjsでテーブルにtrを追加するメソッドを実装する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。
関連ラベル:ソース:php.cnこのウェブサイトの声明この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。著者別の最新記事
2018-06-23 18:19:43 2018-06-23 18:17:39 2018-06-23 18:11:37 2018-06-23 18:10:14 2018-06-23 18:06:43 2018-06-23 18:04:28 2018-06-23 18:02:45 2018-06-23 18:00:45 2018-06-23 17:58:23 2018-06-23 17:56:41最新の問題JavaScript のパフォーマンス制限を特定する Javascript のボトルネックを見つけようとしています。基本的に、私はJavaScriptで書かれたChrome拡張機能を開発していますが、タスクの実行には4〜5秒かかります...から 2023-10-31 20:47:1701229関連トピック詳細>