title: Completed 406 Not Acceptable error when attempting Angular.js query() function
body: <p>I want to show index of cards by using Angular.js and Rails.</p>
  
  <p>This is my code.</p>
  
  <pre><code># app/views/decks/show.html.erb
  &lt;div ng-controller="DeckCtrl"&gt;
    &lt;form ng-submit="addCard()"&gt;
      &lt;input type="text" ng-model="newCard.front" /&gt;
      &lt;input type="submit" value="Add"&gt;
    &lt;/form&gt;
    {{newCard.front}}
    &lt;ul&gt;
      &lt;li ng-repeat="card in cards"&gt;
        {{card.front}}
      &lt;/li&gt;
    &lt;/ul&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>And coffee script</p>
  
  <pre><code># app/assets/javascripts/decks.js.coffee
  app = angular.module("Deck", ["ngResource"])
  
  @DeckCtrl = ($scope, $resource) -&gt;
    Card = $resource("/cards/:id", {id: "@id"}, {update: {method: "PUT"}})
    $scope.cards = Card.query()
  
    $scope.addCard = -&gt;
      $scope.cards.push($scope.newCard)
      $scope.newCard = {}
  </code></pre>
  
  <p>And <code>CardsController</code>.</p>
  
  <pre><code>class CardsController &lt; ApplicationController
    respond_to :json
    def index
      respond_with Card.all
    end
  
    def show
      respond_with Card.find(params[:id])
    end
  
    def create
      respond_with Card.create(card_params)
    end
  
    def update
      respond_with Card.update(params[:id], card_params)
    end
  
    def destroy
      respond_with_Card.destroy(params[:id])
    end
  
    private
      # Never trust parameters from the scary internet, only allow the white list through.
      def card_params
        params.require(:card).permit(:front, :back, :tips, :cardtype, :deck_id, :box_number)
      end
  end
  </code></pre>
  
  <p>the <code>addCard</code> function is working, but <code>Card.query()</code> give me this error.</p>
  
  <pre><code>Started GET "/cards" for 127.0.0.1 at 2014-04-17 10:39:42 +0900
  Processing by CardsController#index as HTML
  Completed 406 Not Acceptable in 2ms
  
  ActionController::UnknownFormat - ActionController::UnknownFormat:
  </code></pre>
  
  <p>It looks like <code>Angular.js</code> sends <code>HTML</code> not <code>json</code>, that causes error, is that right?
  How can I remove this error?</p>