最近在自己的rails專案中用到了AngularJS，所以就順便做一個記錄。注意這裡並非使用一般常用的angularjs-rails的gem，而是使用rails-asset去安裝angular。使用rails-asset安裝angular的好處在於我們可以選擇要安裝的版本與其它angular的套件，不過缺點就是要自己做一些設定才能在rails中使用它。步驟如下：

使用rails-asset安裝AngularJS

Gemfile

source 'https://rails-assets.org' do
  gem 'rails-assets-angularjs'
end

在applicaiton.js中加入angularjs

app/assets/javascripts/application.js

//= require angular

加入AngularJS的啟動點

我們必須要選擇某個DOM來啟動我們自己寫的angular的module，最常選擇的地方就是body，但要注意的是因為turbolinks的關係，直接寫在body中會造成AngularJS在頁面重新讀取時無法運作。所以我們要自己寫個js在ready與page:load的時候啟動angular module。

app/assets/javascripts/angular_app.js.coffee

app = angular.module('MyApp')

on_ready = ->
  angular.bootstrap("body", ['MyApp'])

$(document).ready(on_ready)
$(document).on('page:load', on_ready)

接著把這個js也加入application.js中，注意要放在angularjs之後。

app/assets/javascripts/application.js

//= require angular
//= require angular_app

這樣就完成啦，可以開心的在rails中使用angular了。

P.S.

不要再跟我戰為什麼不改用react(那我就會反問為什麼不用angular的directive？)，我就是喜歡angular…好吧，找個時間分享一下怎麼在rails中使用react。