技術

【AngularJS】angularjs-datatable。クリックが効かない問題!

投稿日:

どうも中田です。

今日は情けないブログを書きます。

angularJSでdatatableを使いたい!
ってことで、angular-datatablesを使うことになりました。
http://l-lin.github.io/angular-datatables/#/gettingStarted

大変便利なんですが、行削除や行編集をした後クリックが効かない問題が発生しました。
画面更新したらできるようになるんですが、なんでだろうな〜って悩んでたら
原因はこれです。

原因

datatablesプロパティの設定ミス!

本当に情けないブログですが、
もし、、もし困っている人がいたらと思いまして。。(いないか)

問題となった書き方

<table id="dataTables"
	datatable
	dt-options="dtOptions"
	dt-column-defs="dtColumnDefs">
	<thead>
		<tr>
			<th class="col-sm-10">column1</th>
			<th class="col-sm-2">column2</th>
		</tr>
	</thead>
	(略)

正しい書き方

<table id="dataTables"
	datatable="ng"
	dt-options="dtOptions"
	dt-column-defs="dtColumnDefs">
	<thead>
		<tr>
			<th class="col-sm-10">column1</th>
			<th class="col-sm-2">column2</th>
		</tr>
	</thead>
	(略)

間違い探しみたいですが、要はdatatables=”ng”というプロパティの設定が必要でしたよという話。

ここに書いてあるよ

Don’t forget to set the properties ng in the directive datatable in order to tell the directive to use the Angular way!
訳:角度の方法を使用するように指示を伝えるためにディレクティブのDataTableのngのプロパティを設定することを忘れないでください!

…..とにかくngプロパティを忘れるなと強く書いてあるのに、しっかりちゃっかり忘れてました。

誰に謝ってるか分かりませんが、なんかすいません。

感謝サイト
もちろん公式ページ

-技術
-,

執筆者:


comment

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください

関連記事

no image

[Angular] リアクティブフォームの値をtsファイルで設定する。

こんにちは、コーテッグの小山です。 Angularのリアクティブフォームについて …

[Angular6] 一つのタグに複数の条件分岐を書く

こんにちは どうしても一つのタグに複数の条件分岐を書きたい時があるかと思います。 …

[SSL] let’s encryptの更新でエラー?!

どうも中田です。 無料でSSL証明書が取得できる今日この頃、いかがお過ごしでしょ …

[Xcode]Provisioning Profileの中身を確認する方法

こんにちは。たなかです。 以前『[Xcode]Provisioning Prof …

no image

[Rails]link_toをhelperから使う

こんばんは Railsでviewを作成している時に、helperからlink_t …