将Angular.js与Rails集成

Question

Background

I'm getting started with building an app with an Angular.js front end and a Rails back end. Working through the thinkster tutorial, I believe I just need bower to help me install the angular and bootstrap packages (basically the front end dependencies). Then I need to require the packages through the asset pipeline in Rails, use a few additional gems, and I should be good to go.

Problem

To see if things are working properly, I have a very simple _home.html file in app/assets/javascripts/home and that should be loaded up through ui-router under the 'home' state (ui-router configuration is in app.js). The end result should be a page that displays "ScholarShipIt" and "Home Template" when the ui-view state is loaded correctly. However, it just displays "ScholarShipIt" which tells me that the state isn't loading.

Troubleshooting

I have tried outputting text to the console at various places in the js files to see where things are loading. I've also tried setting $scope.test in the app.js file and then setting up an expression to display that value but that did not work either. My impression is that the angular packages are not being loaded up properly and I'm not sure what I'm missing.

Code Samples

Relevant gems used

gem 'angular-rails-templates'
gem 'angular-ui-bootstrap-rails'
gem 'angular_rails_csrf'
gem 'responders'
gem 'sprockets'

application.js

//= require angular
//= require angular-rails-templates
//= require angular-ui-router
//= require angular-ui-bootstrap
//= require_tree .

app.js

(function(){
  var app = angular.module('scholarShipIt', ['ui.router','templates']);

  app.config(function($stateProvider, $urlRouterProvider){

    $stateProvider
      .state('home', {
      url: '/home',
      controller: 'HomeController',
      templateUrl: 'home/_home.html'
    });

  $urlRouterProvider.otherwise('home');
  });

}());

HomeController.js

(function() {
  var app = angular.module('scholarShipIt');

  var HomeController = function($scope) {
    $scope.test = "testing";
  };
  console.log("test");

  app.controller('HomeController', HomeController);
}());

Main Question

What am I missing from my application that Rails needs to load the angular files?

(I'd be curious to know how you usually set up your application for this as well)

GitHub Repo

Answer 1

我的javascript_include_tag在“申请”后出现了一些错误的文字