user6934713 user6934713 - 1 month ago 19
AngularJS Question

Angular nested controller errror

I am trying to nest controller and I am getting the following error: Error: [ng:areq] Argument 'MainController' is not a function, got undefined. I searched and I sow that there is a similar question but the answer was not applicable to my case.
Thank you for the help in advance

_Layout.cshtml

<body ng-controller="MainController" layout="column">
<div>
<md-content flex >
<div>
<md-toolbar class="md-accent">
<div class="md-toolbar-tools">
</div>
</md-toolbar>
</div>
<md-content flex layout-align="center center">
<md-sidenav md-component-id="left" class="md-sidenav-left md-whiteframe-z2" layout="column" id="sideNav">
<section layout="column">
<md-button class="md-raised md-primary">
@Html.ActionLink("Admin", "Index", "Admin/Index", new { area = "" }, new { @class = "myButtons" })
</md-button>
</section>
</md-sidenav>
<md-button class="md-raised md-primary" ng-click="clickSide('left')">Show menu</md-button>
<md-content class="AppContainer">
@RenderBody()
</md-content>
</md-content>
<footer>
<div layout="row" layout-align="center center">
<h2>My Awesome Footer &copy; @DateTime.Now.Year</h2>
</div>
</footer>
</md-content>
</div>
</body>


app.js(main controller)

var MyApp = angular.module('MyApp', ['ngMaterial', 'ngMessages', 'ngRoute']);

MyApp.controller('MainController', function ($scope,$rootScope, $http, $filter, $mdDialog, $timeout, $mdSidenav, $window, $location) {
$scope.clickSide = function (dir) {
$mdSidenav(dir).toggle();
};

});


AdminController.js

angular.module('MyApp', ['ngMaterial', 'ngMessages'])
.controller('AdminController', function ($scope, $http, $filter, $mdDialog) {
$scope.test = "Hello";

});

Answer

You do not need to declare the Module again in the AdminController, Change it as follows,

MyApp.controller('AdminController', function ($scope, $http, $filter, $mdDialog) {
$scope.test = "Hello";    
});
Comments