参数“ContactsCtrl”不是函数,未定义

像这样更改你的index.html;

<script src="index.js"></script>
<script src="contacts.js"></script>

在您的联系人.js中更改

var myApp = angular.module('contacts', []); 到

var myApp = angular.module('contacts');

有两个参数的角度模块 angular.module('contacts', []); 将创建一个新的模块,但具有单个参数的角度模块 angular.module('contacts'); 将拾取现有模块。在这种情况下 'contacts'

您正在中重新定义您的应用程序 index.js ,因此在中创建的控制器 contacts.js 丢失。从中删除此行 索引js :

var myApp = angular.module('contacts', []);

我建议创建两个不同的模块名称,一个在index.js中(这将是你在html ng app属性中引用的应用程序名称),另一个在contacts.js(控制器的模块名称)中。在index.js中创建一个对contacts.js`的依赖项。我通过以下操作解决了这个问题。

更新了contacts.js 在这里,我将联系人更新为联系人控制器

var myApp = angular.module('contactsController', []);
myApp.controller('ContactsCtrl', function ($scope) {
$scope.name = "omar";
});

更新的index.js 在这里,我添加了contactsController作为依赖项。我发现将其命名为app.js更容易。这样,ng应用程序总是映射到app.js中的模块名称。

 var myApp = angular.module('contacts', [contactsController]);

  myApp.config(function ($routeProvider) {
   $routeProvider
    .when('/', { controller: 'ContactsCtrl', templateUrl: '/views/show-contacts.html' })
   //.when('/view2', { controller: 'MyCont', templateUrl: 'V2.htm' })
   .otherwise({ redirectTo: '/' });
   });