0

我正在尝试让我的第一个 AngularJS 应用程序使用 Rails 后端运行,到目前为止我遇到了一些问题,但不知何故设法继续前进,但现在还有另一个问题。

看来我的 Angular 标签没有评估。这是它的样子

在此处输入图像描述

以下是我的设置

#app/assets/javascripts/recipes.js
this.recipe = angular.module('recipe',['ngRoute']);
this.recipe.config(['$routeProvider', function($routeProvider){
  return $routeProvider.otherwise({
     templateUrl: '../templates/home.html',
     controller: 'RecipeCtrl'
  });
}]);

模板文件

#public/templates/home.html
Value of "foo": {{foo}}  

吴控制器

#app/assets/javascripts/angular/controllers/RecipeCtrl.js
this.recipe.controller('RecipeCtrl',['$scope', function($scope){
  $scope.foo = 'bar'
}]);

布局文件

#app/views/layouts/application.html.haml
!!!
%html{'ng-app' => 'recipe'}
  %head
    %title WILT
    = stylesheet_link_tag    "application", media: "all"
    = javascript_include_tag "application"
    = javascript_include_tag '//cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.20/angular.js'
    = javascript_include_tag '//cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.20/angular-route.js'
    = csrf_meta_tags
  %body
    %ng-view
      = yield

编辑

HTML 页面的来源

<!DOCTYPE html>
<html ng-app='recipe'>
  <head>
    <title>WILT</title>
    <link href="/assets/application.css?body=1" media="all" rel="stylesheet" />
    <link href="/assets/recipes.css?body=1" media="all" rel="stylesheet" />
    <script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.20/angular.js"></script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.20/angular-route.js"></script>
    <script src="/assets/jquery.js?body=1"></script>
    <script src="/assets/jquery_ujs.js?body=1"></script>
    <script src="/assets/angular.js?body=1"></script>
    <script src="/assets/angular-animate.js?body=1"></script>
    <script src="/assets/angular-resource.js?body=1"></script>
    <script src="/assets/angular/controllers/RecipeCtrl.js?body=1"></script>
    <script src="/assets/recipes.js?body=1"></script>
    <script src="/assets/application.js?body=1"></script>
    <meta content="authenticity_token" name="csrf-param" />
    <meta content="Mducbu35Xjovr50CaR4zX5yWNhZ/3Q8RKYaz1B8xGXg=" name="csrf-token" />
  </head>
  <body>
    <ng-view>

    </ng-view>
  </body>
</html>
4

0 回答 0