javascript - AngularJS 中的 Ng-view 不起作用

标签 javascript html angularjs

我有一个简单的 Angular 应用程序和两个链接,我希望 Angular 为我更改 URL 并在同一单页应用程序中显示每个链接的正确 View 。但是当我在主模块中添加 Controller 模块时 - 它不起作用!

app.js

'use strict';

var app = angular.module('app', ['ngRoute','ngResource','ngSanitize','ui.select','appControllers'])

.config(['$routeProvider',function($routeProvider){
    $routeProvider
    .when('/roles',{
        templateUrl: '/views/roles.html',
        controller: 'rolesController'
    })
    .otherwise(
        { redirectTo: '/views/index.html'}
    );
}]);

index.html

<!DOCTYPE html>
<html ng-app="app">
<head>
<title>Spring boot and Angularjs Tutorial</title>
<link rel="stylesheet" href="/css/app.css">
<script src="/js/app.js"></script>
<script src="/js/controllers.js"></script>
</head>
<body>
<h2>Administrator Panel</h2>
<div class="home-section">
<ul class="menu-list">
    <li><a href="#/report">Report</a></li>
    <li><a href="#/roles">Roles</a></li>
</ul>
</div>
<div ng-view></div>
</body>
</html>

controllers.js

'use strict';

var appControllers = angular.module('appControllers');

appControllers.controller('rolesController', ['$scope', function($scope) {
$scope.headingTitle = "Roles List";
}]);

当 app.js 中没有“appControllers”时, View 可以工作,但 Controller 不能。

var app = angular.module('app', ['ngRoute','ngResource','ngSanitize','ui.select'])

与 - 没有任何作用。我该怎么办?

最佳答案

改变

var appControllers = angular.module('appControllers');

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

您的代码正在尝试获取不存在的现有模块。

From the documentation :

Beware that using angular.module('myModule', []) will create the module myModule and overwrite any existing module named myModule. Use angular.module('myModule') to retrieve an existing module.

关于javascript - AngularJS 中的 Ng-view 不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38528581/

相关文章:

javascript - 将除选定之外的所有其他状态更改为未选定

javascript - 仅针对 CSS 中父子之间相同类的第一次直接匹配

javascript - 使用 jQuery、Javascript 或 PHP 从备用选择中选择 <select> <option>

javascript - 如何从 google map api 更改 map 位置?

javascript - 为什么在用作选择器的类或 ID 已从 HTML 中删除后仍会调用 jQuery 函数?

angularjs - 新 Firebase 中的 Firebase angularfire

javascript - 为什么当我更改副本时原始数组会发生变化?

javascript - 如何在不替换节点属性的情况下替换文本

web - 在 WebMatrix 3 中识别 AngularJS 语法

javascript - 从子范围到父范围的Angularjs ng-show不刷新