使用按钮处理多个控制器

Handle multiple controllers with buttons

本文关键字：控制器 处理 按钮      更新时间：2023-09-26

我有一个菜单，包含很多按钮。每次我点击一个按钮时，我都希望显示一个确定的控制器。

我是 AngularJs 的初学者，我找不到"显示 XXXXCtrl"的代码

缺少的代码在这里：

app.controller('menuCtrl', function($scope) {
    $scope.showtest = function(key, val) {
        //display testCtrl
    }
    $scope.showCustomers = function(key, val) {
        //display customersCtrl
    }
});

在此处查看完整代码：http://plnkr.co/edit/tYFNcYwK8uEJzZGCPQxB?p=preview

一开始我只有customersCtrl，他显示来自customersCtrl的数据，所以{{x.titre}}和其他标签都在显示数据，但是由于我添加了其他控制器，我不知道为什么不再替换{{x.titre}}

请帮忙，我是 angularJs 的新手，这对我来说有点复杂:(

一种方法是让您的菜单控制器包含您尝试隐藏/显示的两个视图。

<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>

然后在您的控制器中，您可以执行

$scope.showtest = function(key, val) {
    $scope.showTestView = true;
}
$scope.showCustomers = function(key, val) {
    $scope.showCustomerView = true;
}

见 http://plnkr.co/edit/k6YScPNv6SmxWuG3GIfv?p=preview

看看$route文档。页面末尾有一个关于通过路由导航切换控制器的很好的例子。

您可以特别注意配置$routeProvider的示例脚本.js该脚本。

让我知道这是否有帮助。

相关文章：