1
Ich bin ein Anfänger mit eckigen. Ich versuche ein Beispiel aus dem Entwicklerhandbuch, um mir beim Lernen zu helfen. das ist mein code .. ich scheine einen fehler zu bekommen TypeError: Kann 'property' 'Template' von undefined nicht lesen und ich verstehe, dass es tempale ist undefiniert ist sogar though seinen Teil von meinem $ routeProvider. aber ich habe nicht das Wissen, wie man das repariert. Kann jemand helfen?TypeError: Kann die Eigenschaft 'template' von undefined nicht lesen
Dank
angular.module('ngRouteExample', ['ngRoute'])
.controller('MainController', function($scope, $route, $routeParams, $location, routeTemplateMonitor) {
$scope.$route = $route; //these are used by index.html pre for debug
$scope.$routeParams = $routeParams;
$scope.$location = $location;
routeTemplateMonitor.routeMonitor();
})
.controller('BookController', function($scope, $routeParams) {
$scope.name = "BookController";
$scope.params = $routeParams;
})
.controller('ChapterController', function($scope, $routeParams) {
$scope.name = "ChapterController";
$scope.params = $routeParams;
})
.factory('batchLog', ['$interval', '$log', function($interval, $log) {
var messageQueue = [];
function log() {
if (messageQueue.length) { //if theirs a message in the array
$log.log('batchLog messages: ', messageQueue); //print the array
console.log(messageQueue);
//messageQueue = []; //then empty it
} else {console.log('messageQueue is empty!');}
}
$interval(log, 1000); //every 2 seconds print and clear queue. (unelss its empty)
//Note how the log() method is called without()!!!
return {
logMessage: function(message) { //when the service is called with a message add it to the queue
messageQueue.push(message);
}
};
}])
.factory('routeTemplateMonitor', ['$route', 'batchLog', '$rootScope', function($route, batchModule, $rootScope){
return {
routeMonitor: function() {
$rootScope.$on('$routeChangeSuccess', function($route, batchLog, $rootScope){
console.log('$route.current', $route.current);
console.log('$route.current.template', $route.current.template);
batchLog.logMessage($route.current ? $route.current.template : null);
});
}
};
}])
.config(function($routeProvider, $locationProvider) {
$routeProvider
.when('/Book/:bookId', {
controller: 'BookController',
//templateUrl: 'book.html',
template: 'controller: {{name}}<br />' +
'Book Id: {{params.bookId}}<br />',
resolve: {
// I will cause a 1 second delay
delay: function($q, $timeout) {
var delay = $q.defer();
$timeout(delay.resolve, 1000);
return delay.promise;
}
}
})
.when('/Book/:bookId/ch/:chapterId', {
controller: 'ChapterController',
//templateUrl: 'chapter.html',
template: 'controller: {{name}}' +
'<br /> Book Id: {{params.bookId}}' +
'<br /> Chapter Id: {{params.chapterId}}'
});
// configure html5 to get links working on jsfiddle
$locationProvider.html5Mode(true);
});<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Example - example-$route-service-production</title>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.30/angular.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.30/angular-route.js"></script>
<script src="script1.js"></script>
<script type="text/javascript">
angular.element(document.getElementsByTagName('head'))
.append(angular.element('<base href="' + window.location.pathname + '" />'));
</script>
</head>
<body ng-app="ngRouteExample">
<div ng-controller="MainController">
Choose:1.1
<a href="Book/Moby">Moby</a> |
<a href="Book/Moby/ch/1">Moby: Ch1</a> |
<a href="Book/Gatsby">Gatsby</a> |
<a href="Book/Gatsby/ch/4?key=value">Gatsby: Ch4</a> |
<a href="Book/Scarlet">Scarlet Letter</a>
<br/>
<div ng-view></div>
<hr />
<pre>$location.path() = {{$location.path()}}</pre>
<pre>$route.current = {{$route.current | json}}</pre>
<pre>$route.current.template = {{$route.current.template}}</pre>
<pre>$route.current.templateUrl = {{$route.current.templateUrl}}</pre>
<pre>$route.current.params = {{$route.current.params}}</pre>
<pre>$route.current.scope.name = {{$route.current.scope.name}}</pre>
<pre>$routeParams = {{$routeParams}}</pre>
</div>
</body>
</html>
Bitte vergessen Sie nicht akzeptieren/upvote die Antwort :) – tasseKATT