0

angularjs を使用しようとしており、基本的なサイトを作成するために必要です。残念ながら、角度ルーティングを使用できません。これは、次のエラーです。

Uncaught TypeError: Cannot read property 'module' of undefined angular-route.js:24(anonymous function) angular-route.js:24(anonymous function) angular-route.js:6
Uncaught Error: [$injector:modulerr] Failed to instantiate module mySite due to:
Error: [$injector:modulerr] Failed to instantiate module ngRoute due to:
Error: [$injector:nomod] Module 'ngRoute' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.
http://errors.angularjs.org/1.2.26/$injector/nomod?p0=ngRoute

これは私のコードです:

index.html:

<!DOCTYPE html>
<html>
	<head>
		
		<meta charset="UTF-8">
		<meta content="True" name="HandheldFriendly">
		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
		<meta name="viewport" content="width=device-width">

		<title>Mela Ferro | עיצוב פנים</title>
		<link rel="shortcut icon"  type="image/x-icon"  href="./Style/Images/favicon.ico">
	
		<script data-main="main" src="http://requirejs.org/docs/release/2.1.15/comments/require.js" ></script>

		<link rel="stylesheet" type="text/css" href="./style/main.css">
		<link rel="stylesheet" type="text/css" href="./style/tablet.css" media ="screen and (max-width: 900px">
	
		 
	</head>

	<body >
		<header id="header">
			<main-header/>
		</header>

		<main>
			<div class="main">
				<ul>  
			        <li>Item #1</li>  
			        <li>Item #2</li>  
			        <li>Item #3</li>  
			        <li>Item #4</li>  
			        <li>Item #5</li>  
    			</ul>  
			</div>
		</main>
		<footer>
			<main-footer/>
		</footer>
	</body>
</html>

main.js:

require.config ({
	paths: {
		'angular': 		['./resources/angular'],
		'angularRoute': ['.//resources/angular-route.min'],
		'jquery' : 		['./resources/jquery-1.11.1'],
		'app': 			['./app'],
		'jqueryui' : 	['./resources/jquery-ui'],
		'underscore': 	['./resources/underscore']
	},
	shim :{
		'angular':{
				exports: 'angular'
		},
		 'angularRoute': {
		 	dep:['angular']
		 },
		'jquery':{
			exports:'jquery'
		},
		'jqueryui':{
				exports:'jqueryui',
				dep:['jquery']
		},
		'underscore': {
	            exports: "_"
	        }
		}
	});

window.name = "NG_DEFER_BOOTSTRAP!";

//starting the app
require(['app'], function (app) {

  var $html = angular.element(document.getElementsByTagName('html')[0]);

    angular.element().ready(function() {
        angular.resumeBootstrap([app['name']]);
    });
});

app.js:

define(
	['angular',
	'app/directives/footers/mainFooter/mainFooterDirective',
	'app/directives/headers/mainHeader/mainHeaderDirective','angularRoute'
	]
	,function (angular,mainFooterDirective,mainHeaderDirective) {

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

		app.directive('mainFooter', mainFooterDirective); //will be set to main-footer/main:footer
		app.directive('mainHeader', mainHeaderDirective); //will be set to main-footer/main:footer
    	
    	angular.bootstrap(document, [app['name']]);


  return app;
});

モジュールが作成される前にルートがロードされているように見えますが、回避策を実行して修正する方法を見つけることができませんでした

4

1 に答える 1

1

わかりましたので、次の例を見つけました: http://plnkr.co/edit/3UkSd2UXhlzOWymhLkzK?p=preview そして、メインの js を次のように変更しました

require.config({
    paths: {
        'angular':      './resources/angular',
        'angular-route': './/resources/angular-route.min',
        'jquery' :      './resources/jquery-1.11.1',
        'jqueryui' :    './resources/jquery-ui',
         'underscore':   './resources/underscore'
    },
    shim: {
        "angular": {
            exports: "angular"
        },
        "angular-route": {
            deps: ["angular"]
        },
    'jquery':{
        exports:'jquery'
    },
    'jqueryui':{
            exports:'jqueryui',
            dep:['jquery']
    },
    'underscore': {
            exports: "_"
        }
    }
});



//starting the app
require(['angular','app'], function (app) {
	angular.element(document).ready(function () {
	  app.init();
	});

  });

そして今は機能しています...何が問題で、なぜ失敗したのかわかりませんが、今では問題ないようです。

于 2014-11-12T21:32:10.220 に答える