Я новичок в угловых и застрял с вложенными угловыми контроллерами. Я сохранил все контроллеры в отдельных файлах.js.
Основной контроллер на моей странице проблемы (html) должен вставить другой контроллер "UploadController" для загрузки изображений.
Я не хочу держать основной контроллер и UploadController в том же файле, потому что Uploadcontroller будет использоваться и на других страницах.
//app.js
(function () {
'use strict';
angular.module('myApp', []);
})();
//MainController.js
(function () {
'use strict';
var app = angular.module('myApp', []);
app.controller('MainController', ['$scope', '$http', function ($scope,$http)
{
// my code
}]);
}());
//UploadController.js
(function () {
'use strict';
var app = angular.module('myApp', ["ngMessages"]);
app.controller('EditController', ['$scope', '$http', function ($scope,$http)
{
// Code
}]);
}());
//page.html
<title>
<script src="/cdn/scripts/angular/app.js"></script>
<script src="/cdn/scripts/angular/controller/maincontroller.js"></script>
<script src="/cdn/scripts/angular/controller/uploadcontroller.js"></script>
</title
<body>
<div ng-app="myApp">
<div ng-controller="MainController">
<div ng-controller="UploadController">
</div>
</div>
</div>
</body>
Это ошибка, которую я получаю при запуске кода.
Аргумент "MainController" не является функцией, получил неопределенный
Благодарю.
Попробуй это,
(function() {
'use strict';
angular.module('myApp', []);
})();
(function() {
'use strict';
angular.module('myApp').controller('MainController', ['$scope', '$http', function($scope, $http) {
// my code
$scope.name = "main controller";
}]);
}());
(function() {
'use strict';
angular.module('myApp').controller('EditController', ['$scope', '$http', function($scope, $http) {
// Code
$scope.name = "edit controller";
}]);
}());
<script data-semver="1.4.9" src="https://code.angularjs.org/1.4.9/angular.js" data-require="[email protected]"></script>
<body ng-app="myApp" >
<div ng-controller="MainController">
<p>Hello {{name}}!</p>
</div>
<div ng-controller="EditController">
<p>Hello {{name}}!</p>
</div>
</body>
Вы должны определять свои зависимости приложения только один раз, так как вы не используете какие-либо подмодули.
Это то, что нужно сделать:
app.js
(function () {
'use strict';
angular.module('myApp', ['ngMessages']);
})();
Главный контроллер
(function () {
'use strict';
var app = angular.module('myApp');
app.controller('MainController', ['$scope', '$http', function ($scope,$http)
{
// my code
}]);
}());
Контроллер загрузки
(function () {
'use strict';
var app = angular.module('myApp');
app.controller('EditController', ['$scope', '$http', function ($scope,$http)
{
// Code
}]);
}());
Я удалил [] в UploadController, и он сработал. Спасибо всем за ответ.