如何将控制器和工厂放在单独的文件中

时间:2019-04-14 17:10:17

标签: angularjs

我有一个模块“ app”,我试图将其控制器和一个工厂分开成单独的文件。当我在主app.js文件中链接所有控制器时,该应用程序即可工作。当我尝试将它们移动到新文件时,它会立即中断。

我已经尽一切努力将控制器/工厂保存在单独的文件中,但我不断收到此错误:

  

[$ controller:ctrlreg]未注册名称为'AppCtrl'的控制器。   https://errors.angularjs.org/1.7.2/$controller/ctrlreg?p0=AppCtrl

我已经在主html文件中声明了这些脚本。所有js文件都位于同一目录中。我正在尝试使用angular.module('app)作为对主模块的引用来添加控制器,但是没有任何效果。

我的目录结构:

  

| app

     
    
      

| app.js       | AppCtrl.js

    
  
     

|公共

     
    
      

| index.html

    
  

app.js

angular.module('app', ['ngRoute']);

angular.module('app')
  .config(function ($routeProvider, $locationProvider) {
    $routeProvider
      .when('/', {
        template: require('./home.html'),
        controller: 'AppCtrl'
      })
    $locationProvider.hashPrefix('');
  });

AppCtrl.js

angular.module('app')
.controller('AppCtrl', function ($scope, $route) {
//controller code
});

index.html

<!doctype html>
<html ng-app="app" lang="en">

<head>
  <meta charset="UTF-8">
  <link rel="icon" type="image/x-icon" href="/img/favicon.ico">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" integrity="sha384-WskhaSGFgHYWDcbwN70/dfYBj47jz9qbsMId/iRN3ewGhXQFZCSftd1LZCfmhktB"
    crossorigin="anonymous">
  <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.2/Chart.bundle.js"></script>

  <script src="../app/app.js"></script>
  <script src="../app/AppCtrl.js"></script>


  <base href="/">
</head>

我错过了将它们分开的步骤吗?

0 个答案:

没有答案