0
我不斷收到一個錯誤，試圖將角度注入到我的應用程序中。我收到一個錯誤，說Error: $injector:modulerr Module Error。下面是我的代碼：角度注射器錯誤
管理-的index.html：
<!DOCTYPE html>
<html lang="en" ng-app="app" class="no-js" ng-jq> <!--<![endif]-->
<head>
<meta charset="UTF-8">
<title>AdminLTE 2 | Dashboard</title>
<meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'>
<!-- Bootstrap 3.3.2 -->
<link href="../bower_components/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet" type="text/css"/>
<!-- Font Awesome Icons -->
<link href="../components/font-awesome-4.3.0/css/font-awesome.min.css" rel="stylesheet" type="text/css"/>
<!-- Ionicons -->
<link href="../bower_components/ionicons/css/ionicons.min.css" rel="stylesheet" type="text/css"/>
<!-- Theme style -->
<link href="../bower_components/adminlte/dist/css/AdminLTE.min.css" rel="stylesheet" type="text/css"/>
<!-- AdminLTE Skins. We have chosen the skin-blue for this starter
page. However, you can choose any other skin. Make sure you
apply the skin class to the body tag so the changes take effect.
-->
<link href="../bower_components/adminlte/dist/css/skins/skin-blue.min.css" rel="stylesheet" type="text/css"/>
<!--<link rel="stylesheet" href="../bower_components/html5-boilerplate/css/normalize.css">-->
<!--<link rel="stylesheet" href="../bower_components/html5-boilerplate/css/main.css">-->
<link rel="stylesheet" href="admin-app.css">
<link rel="stylesheet" href="reportview/report-view.css">
<script src="../bower_components/html5-boilerplate/js/vendor/modernizr-2.6.2.min.js"></script>
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
<script>
var locale = 'zh-CN';
document.write('<script src="../bower_components/angular-i18n/angular-locale_'+locale+'.js"><\/script>');
</script>
<![endif]-->
</head>
<body class="skin-blue">
<div class="wrapper">
<!-- Main Header -->
<header class="main-header">
<!-- Logo -->
<a ng-click="$event.stopPropagation()" class="logo"><b>ZAN Admin</b></a>
<!-- Header Navbar -->
<nav class="navbar navbar-static-top" role="navigation">
<!-- Sidebar toggle button-->
<a href="#" class="sidebar-toggle" data-toggle="offcanvas" role="button">
<span class="sr-only">Toggle navigation</span>
</a>
<!-- Navbar Right Menu -->
<div class="navbar-custom-menu">
</div>
</nav>
</header>
<!-- Left side column. contains the logo and sidebar -->
<aside class="left-side main-sidebar">
<!-- sidebar: style can be found in sidebar.less -->
<section class="sidebar">
<!-- search form (Optional) -->
<form action="#" method="get" class="sidebar-form">
<div class="input-group">
<input type="text" name="q" class="form-control" placeholder="Search..."/>
<span class="input-group-btn">
<button type='submit' name='search' id='search-btn' class="btn btn-flat"><i class="fa fa-search"></i></button>
</span>
</div>
</form>
<!-- /.search form -->
<!-- Sidebar Menu -->
<ul class="sidebar-menu">
<li class="header">Header</li>
<!-- Optionally, you can add icons to the links -->
<li class="treeview">
<a href="#"><i class="fa fa-circle-o"></i>Report Views<i class="fa fa-angle-left pull-right"></i> </a>
<ul class="treeview-menu" ng-cloak>
<li ng-repeat="dsm in dsmeta">
<a ng-href="admin-index.html#/admin/reportview/{{dsm.name}}">{{dsm.name}}</a>
</li>
</ul>
</li>
</ul><!-- /.sidebar-menu -->
</section>
<!-- /.sidebar -->
</aside>
<!-- Content Wrapper. Contains page content -->
<div class="content-wrapper" ng-view>
<!-- Content Header (Page header) -->
</div><!-- /.content-wrapper -->
<!-- Main Footer -->
<footer class="main-footer" ng-controller="AdminSyncConsole">
<!-- To the right -->
<!-- <div class="pull-right hidden-xs">
Anything you want
</div> -->
<!-- Default to the left -->
<!-- <strong>Copyright © 2015 <a href="#">Company</a>.</strong> All rights reserved. -->
<!-- Apply any bg-* class to to the info-box to color it -->
<div class="info-box bg-green">
<span class="info-box-icon"><i class="fa fa-bookmark-o"></i></span>
<div class="info-box-content">
<span class="info-box-text">Current Sync Status</span>
<span class="info-box-number">{{syncStatus}}</span>
<!-- The progress section is optional -->
<div class="progress">
<div class="progress-bar" style="width: 70%"></div>
</div>
<span class="progress-description">
70% Increase in 30 Days
</span>
</div><!-- /.info-box-content -->
</div><!-- /.info-box -->
<div class="box box-solid box-default">
<div class="box-header">
<h3 class="box-title">Sync Sessions</h3>
</div>
<div class="box box-default collapsed-box">
<div class="box-header with-border">
<h3 class="box-title">Expandable</h3>
<div class="box-tools pull-right">
<button class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-plus"></i></button>
</div><!-- /.box-tools -->
</div><!-- /.box-header -->
<div class="box-body">
The body of the box
</div><!-- /.box-body -->
</div><!-- /.box -->
</div>
</footer>
</div><!-- ./wrapper -->
<!-- REQUIRED JS SCRIPTS -->
<!-- jQuery 2.1.3 -->
<script src="../bower_components/adminlte/plugins/jQuery/jQuery-2.1.3.min.js"></script>
<!-- Bootstrap 3.3.2 JS -->
<script src="../bower_components/bootstrap/dist/js/bootstrap.min.js" type="text/javascript"></script>
<script src="../bower_components/adminlte/plugins/fastclick/fastclick.min.js"></script>
<!-- build:js ../minjs/angular.js -->
<!-- angular dependencies -->
<script src="../bower_components/angular/angular.min.js"></script>
<script src="../bower_components/angular-resource/angular-resource.min.js"></script>
<script src="../bower_components/angular-translate/angular-translate.min.js"></script>
<script src="../bower_components/angular-translate-loader-partial/angular-translate-loader-partial.min.js"></script>
<script src="../bower_components/angular-touch/angular-touch.min.js"></script>
<script src="../bower_components/angular-animate/angular-animate.min.js"></script>
<script src="../bower_components/angular-sanitize/angular-sanitize.min.js"></script>
<script src="../bower_components/angular-route/angular-route.min.js"></script>
<!-- endbuild -->
<!-- AdminLTE App -->
<script src="../bower_components/adminlte/dist/js/app.js" type="text/javascript"></script>
<script src="../bower_components/angular-translate/angular-translate.js"></script>
<script src="../bower_components/angular-translate-loader-static-files/angular-translate-loader-static-files.js"></script>
<!-- build:js ../minjs/z-ui.js -->
<script src="../js/z-ui.js"></script>
<!-- endbuild -->
<script src="../bower_components/angular-local-storage/dist/angular-local-storage.min.js"></script>
<script src="reportview/reportview.js"></script>
<script src="../translation/translate.js"></script>
<script src="admin-app.js"></script>
<script src="../components/util/report-view-service.js"></script>
</body>
</html>
管理-app.js：
'use strict';
var baseSyncUrl = "../api/rest/{{path.version}}/syncsessions";
var getSyncSessionsReq = {method: "GET", url: baseSyncUrl, params: {targetSystemType:{}, pageSize: ""}, path: {version: "v1"}};
// Declare app level module which depends on views, and components
var app = angular.module('app', ['z.components']);
app.controller('AdminSyncConsole', ['$scope', '$http', 'RESTCaller', function ($scope, $http, RESTCaller) {
$scope.syncStatus = "Completed";
$scope.syncSessions;
//REST API to get the sync sessions
$scope.getSyncSessions = function() {
var req = getSyncSessionsReq;
var targetSystem = {'id': '1', 'type': 'SPOTLIGHT', 'description': 'Spotlight'};
req.params.targetSystemType = targetSystem;
//Page size is not necessarily required
// req.params.pageSize =
var data = RESTCaller.getConfig(req);
data.then(function(result){
if(result) {
console.log("Result: ", result);
}
});
}
//Getting the sync sessions
console.log("Hi");
$scope.syncSessions = $scope.getSyncSessions();
//Call REST API to get the sync status
}]);
我很困惑，爲什麼發生這種情況。我沒有任何其他問題注入angular.min.js到我的其他文件，我似乎無法確定錯誤來自哪裏，因爲它只是抱怨angular.min.js。我已經檢查過，我的ng-app似乎是正確的，並且z.components來自另一個模塊，它來自我已經包含的名爲../js/z-ui.js的文件。 RESTCaller也來自z-ui.js文件。任何幫助，將不勝感激。謝謝！
你想創建或檢索模塊？ – Grisza