對角度和導軌布線在一起感到困惑

Question

我正在嘗試將AngularJS集成到我的應用程序中，其中我在url /events/something下有任何內容，可以通過角度路由來解決。 不過，我一直在關注角度的教程和這只是我似乎無法得到渲染視圖。 我認為自己在路由中做錯了，但似乎無法弄清楚。 誰能幫我嗎？

樣本鏈接： http://localhost:3000/events/events1

Rails路線：

get '/events/:id' => 'event#event'

角度代碼：

var app = angular.module('eventsApp', ['ngRoute', 'templates']);

app.config(['$routeProvider',
    function($routeProvider) {
        $routeProvider.when('events/:id', {
            templateUrl: 'eventTemp.html',
            controller: 'EventsCtrl'
        });
    }
]);
app.controller('EventsCtrl', function($scope, $http){
    console.log('yo!'); //this is never logging
});

外部模板：

<div class = "event" ng-app="eventsApp">
    <div ng-view></div>
</div>

eventTemp.html

<h1>Text</h1>

我正在使用angular-rails-templates gem，並且所有模板都在app/assets/javascripts/templates 。 這是application.js樣子：

//= require jquery
//= require jquery.turbolinks
//= require jquery_ujs
//= require bootstrap-sprockets
//= require_tree .
//= require angular-rails-templates
//= require_tree ./templates
//= require turbolinks

Answer 1

我曾經遇到過類似的問題，解決方法是-使用：

$routeProvider('/events/:id')

代替

$routeProvider('events/:id')

顯然，角度要求是路由路徑以/開頭。

Answer 2

您的Angular應用與模板位於同一目錄嗎？ 如果不是，則templateUrl必須是正確的路徑。

templates/eventTemp.html

Answer 3

我玩了一下，結果發現問題出在

$routeProvider.when('events/:id' 

當我將方法更改為此：

var app = angular.module('eventsApp', ['ngRoute', 'templates']);

app.config([
  '$routeProvider', function($routeProvider) {      
    $routeProvider.
     when('/', {
        templateUrl: '../templates/eventTemp2.html',
        controller: 'EventsCtrl2'
     }).
     otherwise({
        templateUrl: '../templates/eventTemp.html',
        controller: 'EventsCtrl'
     });
  }
]);
app.controller('EventsCtrl', function($scope, $http){
    console.log('yo!');
});

app.controller('EventsCtrl2', function($scope, $http) {
    console.log('yo2');
});

將渲染EventsCtrl2和eventTemp.html2 。