Reputation: 545
I have a menu, containing a lot of buttons. And everytime i click on a button, i want a determined controller to be displayed.
I'm a beginner with AngularJs, i'm not able to find the code for "display the XXXXCtrl"
The missing code is here :
app.controller('menuCtrl', function($scope) {
$scope.showtest = function(key, val) {
//display testCtrl
}
$scope.showCustomers = function(key, val) {
//display customersCtrl
}
});
see the complete code here : http://plnkr.co/edit/tYFNcYwK8uEJzZGCPQxB?p=preview
At the beginning i had only the customersCtrl
, who shows the data from customersCtrl
, so {{x.titre}}
and the other tags were showing data, but since i added other controllers, i don't know why {{x.titre}}
is not replaced anymore
Please help, i'm new to angularJs, it's a bit complicated for me :(
Upvotes: 0
Views: 60
Reputation: 92324
One way to do it would be for your menu controller to contain the the two views you are trying to hide/show.
<div ng-app="myApp" ng-controller="menuCtrl">
<button href="#" ng-click="showtest()">display testCtrl</button>
<button href="#" ng-click="showCustomers()">display customersCtrl</button>
<div ng-controller="testCtrl" ng-show="showTestView">...</div>
<div ng-controller="customersCtrl" ng-show="showCustomerView">...</div>
</div>
Then in your controller, you could do
$scope.showtest = function(key, val) {
$scope.showTestView = true;
}
$scope.showCustomers = function(key, val) {
$scope.showCustomerView = true;
}
See http://plnkr.co/edit/k6YScPNv6SmxWuG3GIfv?p=preview
Upvotes: 1
Reputation: 379
Take a look at $route documentation. There is a good example at the end of the page about switching controllers through route navigation.
You may give special attention to sample's script.js that configure the $routeProvider.
Let me know if this helps.
Upvotes: 0