Wenn ich versuche, dynamisch einen Controller zu laden, ich die folgende Fehlermeldung mit: sideCtrl & p1 = nicht% 20aNaNunction% 2C% 20got% 20undefinedrequirejs AngularJS Controller nicht definiert
aber für Seite1, der Code funktioniert fein. Hier ist mein Code:
main.js:
require.config({
paths: {
jquery: ['//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min', 'lib/jquery/jquery_2.0.0.min.js'],
angular: ['//ajax.googleapis.com/ajax/libs/angularjs/1.2.16/angular.min', 'lib/angular/angular_1.2.16.min'],
angularRoute: ['//ajax.googleapis.com/ajax/libs/angularjs/1.2.16/angular-route.min', 'lib/angular-route/angular-route_1.2.16.min']
},
shim: {
'angular' : {'exports' : 'angular'},
'angularRoute': ['angular']
},
deps: ['app']
});
config.js:
define([],function(){
function config($routeProvider) {
$routeProvider
.when('/page1', {
templateUrl: 'templates/page1.html',
controller: 'mainCtrl'
})
.when('/page2', {
templateUrl: 'templates/page2.html',
resolve: {
load: function($q, $route, $rootScope) {
var deferred = $q.defer();
var dependencies = [
'sideCtrl.js'
];
require(dependencies, function() {
$rootScope.$apply(function() {
deferred.resolve();
});
});
return deferred.promise;
}
}
})
.otherwise({redirectTo: '/page1'});
}
config.$inject=['$routeProvider'];
return config;
});
app.js
/*global require*/
'use strict';
define([
'angular','angularRoute', 'mainCtrl', 'config'
], function (angular, angularRoute,mainCtrl,config) {
var app = angular.module('app', ['ngRoute']);
app.config(config);
app.controller('mainCtrl', mainCtrl);
angular.bootstrap(document, ['app']);
return app;
});
sideCtrl.js:
"use strict";
define(['app'], function (app) {
app.controller('sideCtrl', ['$scope',
function ($scope) {
console.log("hello world");
$scope.names="krish";
console.log("sideCtrl calling");
}
]);
console.log(app);
return app;
});
page2.html
<div ng-controller="sideCtrl">
asdasdas
{{names}}
</div>
Wenn ich das tue, das ist der Fehler: $ controllerProvider nicht – krish
Sie müssen definiert wird es zuerst injizieren? Ich tue dies auf meiner Konfiguration 'app.provider '(' Resolver ',' $ controllerProvider ',' $ compileProvider ',' $ filterProvider ',' $ bereitstellen ', Funktion ($ controllerProvider, $ compileProvider, $ filterProvider, $ zur Verfügung stellen) { angular.register = { Controller: $ controllerProvider.register, Richtlinie: $ compileProvider.directive, Filter: $ filterProvider.register, Fabrik: $ provide.factory, Service: $ provide.service, Konstante: $ provide.constant };}]) ' – johnjerrico
okay, mit app.controllerProvider anstelle von $ controllerProvider arbeitete für mich. Danke vielmals. – krish