(apply-generic op . args)

教育者, 将軍, 栄養士, 心理学者, 親はプログラムする. 軍隊, 学生, 一部の社会はプログラムされる. - 計算機プログラムの構造と解釈 序文

Turbolinksを有効にしたままでangularjsを使用する

Turbolinks and Angularjs

最近はangularjsとRails4の組み合わせであそ、、、仕事しています。 まだまだangularjs触り始めて数日ですが、Turbolinksを有効にしているとng-showなどが画面遷移した際に上手く動かなかったのにハマったので、解決方法を自分用にメモ。

htmlからng-appを削除する

普通(?)はhtmlタグに

<html ng-app='MyApp'>

とか書くと思うんですが、これを削除します。

<html>

app.js.coffeeでbootstrapする

 window.App = angular.module('myApp', ['ngResource'])
$(document).on('ready page:load', ->
  angular.bootstrap(document.body, ['myApp'])
)

2~4行目を追記することで、turbolinkを有効にしていてもangularjsがbootstrapingされるので正常にng-showなどが動作しました。

備考

まだそこまでガッツリangularjsで書きまくっている訳ではないので、なにか問題でるかもしれませんが、

  1. inputに名前を入力
  2. /api/hoge/fugaにgetしてその名前が既に存在しているかチェック
  3. 既に存在していたら「その名前は既に使われています」みたいなalertを表示

くらいのは上記の方法でも正常に動作しました。

Good Luck!