將Angular.js與Rails集成

Question

背景

我開始使用Angular.js前端和Rails后端構建應用程序。 通過thinkster教程，我相信我只需要Bower即可幫助我安裝angular和bootstrap軟件包（基本上是前端依賴項）。 然后，我需要通過Rails中的資產管道要求這些軟件包，使用一些額外的gem，這應該很好。

問題

為了查看一切是否正常，我在app / assets / javascripts / home中有一個非常簡單的_home.html文件，應通過ui-router在“ home”狀態下加載該文件（ui-router配置在應用程序中）。 js）。 最終結果應該是正確加載ui視圖狀態時顯示“ ScholarShipIt”和“主頁模板”的頁面。 但是，它僅顯示“ ScholarShipIt”，告訴我狀態未加載。

故障排除

我嘗試將文本輸出到js文件中各個位置的控制台，以查看加載的位置。 我也嘗試過在app.js文件中設置$ scope.test，然后設置一個表達式來顯示該值，但這也不起作用。 我的印象是，角度包沒有正確加載，我不確定自己缺少什么。

代碼樣例

所使用的相關寶石

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);
}());

主要問題

我的應用程序中缺少什么，Rails需要加載角度文件？

（我很想知道您通常也如何為此設置應用程序）

GitHub回購

Answer 1

我的javascript_include_tag在“申請”后出現了一些錯誤的文字