Angular.js nested Controller $scopes must be predefined?
Why is defining a property for the child controller's $scope properties
necessary?
This ng-class on the HTML element works:
app.controller("mainController",['$anchorScroll','$scope','$location',function($anchorScroll,$scope,$location){
$scope.forms={};
}]);
app.controller("modalController",['$scope',function($scope){
$scope.forms.contactForm = false;
$scope.forms.toggleContactForm = function(){
$scope.forms.contactForm = !$scope.forms.contactForm;
}
}]);
<body ng-controller="mainController">
<div ng-class="{hidden:!forms.contactForm}" id="contactForm"
ng-controller="modalController"></div>
</body>
This ng-class does not:
app.controller("mainController",['$anchorScroll','$scope','$location',function($anchorScroll,$scope,$location){
}]);
app.controller("modalController",['$scope',function($scope){
$scope.contactForm = false;
$scope.toggleContactForm = function(){
$scope.contactForm = !$scope.contactForm;
}
}]);
<body ng-controller="mainController">
<div ng-class="{hidden:!contactForm}" id="contactForm"
ng-controller="modalController"></div>
</body>
No comments:
Post a Comment