Angular JS/Rube-on-Rails-控制器未识别错误

Angular JS / Ruby on Rails - controller not recognised error

本文关键字：识别 错误 控制器 Rube-on-Rails- JS Angular      更新时间：2023-09-26

我一直在学习Thinkster教程来实现Angular JS/Rube-on-Rails应用程序，但遇到了一些困难。

我的控制器没有被识别，尽管在检查内容时被列在页面的来源中。控制台错误Error: [ng:areq] Argument 'NavCtrl' is not a function, got undefined突出显示了这一点。

我已经尝试了我能在网上找到的一切，但都无济于事。我目前唯一的猜测是，这是由于Angular、Rails、gem、依赖性的版本，或者是我没有考虑过的原因。或者是打字错误，但我没有发现！

最终的结果是加载一个空白页面，除了导航栏的内容，它在没有控制器逻辑的情况下呈现。我将在下面展示一些代码，如果需要其他答案，请告诉我。

这是application.html.erb:

<!DOCTYPE html>
<html>
<head>
  <title>Angular JS</title>
  <%= stylesheet_link_tag    'application', media: 'all' %>
  <%= javascript_include_tag 'application' %>
  <%= csrf_meta_tags %>
</head>
<!-- body -->
  <body ng-app="flapperNews">
    <div class="row">
      <div class="col-md-6 col-md-offset-3">
        <div ng-include="'nav/_nav.html'"></div>
        <ui-view></ui-view>
      </div>
    </div>
    <h1>DEBUG</h1>
  </body>
</html>

app.js，包含应用程序模块和视图配置：

angular.module('flapperNews', ['ui.router', 'templates', 'Devise'])
.config([ 
'$stateProvider',
'$urlRouterProvider',
function($stateProvider, $urlRouterProvider) {
  $stateProvider
    .state('home', {
      url: '/home',
      templateUrl: 'home/_home.html',
      controller: 'MainCtrl'
    }) 
    .state('posts', {
      url: '/posts/{id}',
      templateUrl: 'posts/_posts.html',
      controller: 'PostsCtrl'
    })
    .state('login', {
      url: '/login',
      templateUrl: 'auth/_login.html',
      controller: 'AuthCtrl',
      onEnter: ['$state', 'Auth', function($state, Auth) {
        Auth.currentUser().then(function (){
          $state.go('home');
        });
      }]
    }) 
    .state('register', {
      url: '/register',
      templateUrl: 'auth/_register.html',
      controller: 'AuthCtrl',
      onEnter: ['$state', 'Auth', function($state, Auth) {
        Auth.currentUser().then(function (){
          $state.go('home');
        });
      }]
    });
  $urlRouterProvider.otherwise('home');
}]);

值得注意的是，在上面的两个文件之间，<div ng-include="'nav/_nav.html'"></div>至少呈现了一些角度内容，而<ui-view></ui-view>则显示"什么都没有"（无关链接）。

这是AWOL navCtrl.js:

angular.module('flapperNews')
.controller('NavCtrl', [
'$scope',
'Auth',
function($scope, Auth){
  console.log('nav controller loaded');
  $scope.signedIn = Auth.isAuthenticated;
  $scope.logout = Auth.logout;
  Auth.currentUser().then(function (user){
    $scope.user = user;
  });
  $scope.$on('devise:new-registration', function (e, user){
    $scope.user = user;
  });
  $scope.$on('devise:login', function (e, user){
    $scope.user = user;
  });
  $scope.$on('devise:logout', function (e, user){
    $scope.user = {};
  });
}]);

从控制台、时间线和来源来看，似乎所有相关文件都在加载，并且顺序正确。所以请帮忙！

谢谢，史蒂夫。

我想你忘了在.state（'posts'…和.state）（'home'…

.state('home', {
        url: '/home',
        templateUrl: 'home/_home.html',
        controller: 'MainCtrl',
        resolve: {
            postPromise: ['posts', function(posts){
                return posts.getAll();
                }]
            }
    })
    .state('posts', {
        url:'/posts/{id}',
        templateUrl: 'posts/_posts.html',
        controller:'PostCtrl',
        resolve: {
            post: ['$stateParams', 'posts', function($stateParams, posts) {
                return posts.get($stateParams.id);
                }]
            }
    })
相关文章：