Angular with Rails - submit not working with Angular controller

Question

I'm working on Rails cast #405, and I'm attempting to learn how to integrate Rails with Angular--I'm a newbie on this integration.

In assets/javascripts/raffle.js.coffee, I have:

app = angular.module 'Raffle', []

app.controller "RaffelCtrl", @RaffelCtrl = ($scope) ->
  $scope.entries = [
    {name: "Larry"}
    {name: "Curly"}
    {name: "Moe"}
  ]

  $scope.addEntry = ->
    $scope.entries.push($scope.newEntry)
    $scope.newEntry = {}

In my show template (haml), I have...

%div{ 'ng-app' => 'Raffle'}
  %div{ 'ng-controller' => 'RaffelCtrl'}
    %form{"ng-submit" => "addEntry"}
      %input{"ng-model" => "newEntry.name", :type => "text"}/
      %input{:type => "submit", :value => "Add"}/
    %br
    %ul
      %li{"ng-repeat" => "entry in entries"}
        {{entry.name}}

When I click on the input button to add another entry, nothing happens. I definitely have contact between the rails view the Angular controller, b/c am able to display the list of entries. I just can't submit a new one. Any help would be much appreciated on this. My gem file has angularjs-rails and I'm using Twitter bootstrap. With my application.js, I've removed turbolinks. Thanks!

Answer 1

You need to call the addEntry function on your ng-submit like so: addEntry(), then it should work.