在按钮onClick中从另一个控制器调用功能 [英] call function from another controller in a button onClick

问题描述

我试图单击一个按钮并触发另一个控制器的功能.这里重要的部分是我有两个控制器DashboardController，其中有一个带按钮的数据表和一个onClick，我调用了另一个名为DashboardDeviceController的控制器的函数.

I'm trying to click on a button and trigger a function of another controller. The important part here is that I have two controllers DashboardController where I have a datatable with a button and with a onClick I call a function of the other Controller named DashboardDeviceController.

我正在这样做，所以当我单击按钮时，我将打开一个带有选项卡的新视图，其中每个选项卡都具有图形.

I'm doing this so when I click on the button I will open a new view with tabs where each tab will have graphs.

因此，我想在单击按钮时指定将打开的选项卡，而不是默认情况下为活动选项卡的消费".

So I want when I click on my button to specify the tab which it will be open instead of "Consumptions" which is the active tab by default.

DasboardController

datatableoptions中的

按钮

button inside datatableoptions

return icon = '<center><a class="state-link" data-state-id="' + data.id + '" ng-click="setActiveTab(\"consumptions\")"><i style="color:#ff0000; width:21px; height:21px" title="Consumptions threshold exceed" class="fa fa-warning"></i></a></center>';

我尝试这样做，但是没有用..

and I try to do this but didnt work..

$rootScope.$on("setActiveTab", function(name, obj, event){
                $scope.parentmethod(name, obj);
            });

            $scope.parentmethod = function(name, obj, event) {
                // task
                console.log("name ",name);
                var btn = event.currentTarget;
                obj[btn.id]=true;
                console.log("btn ", btn);
                activeTab = name;
            }


DashboardDeviceController

controllerScope.activeTab = {
            consumptions: true,
            network     : false,
            ap          : false,
            modem       : false,
            system      : false,
        };


controllerScope.getActiveTab = function () {
            console.log("getActiveTab()");

            var activeTab = null;
            for(var tabName in controllerScope.activeTab) {
                if (controllerScope.activeTab[tabName]) {
                    activeTab = tabName;
                    break;
                }
            }
            return activeTab;
        }

        controllerScope.setActiveTab = function (name) {
            console.log("setActiveTab()");

            var activeTab = null;
            for(var tabName in controllerScope.activeTab) {
                if (controllerScope.activeTab[tabName] == name) {
                    controllerScope.activeTab = name;
                    break;
                }
            }
        }

推荐答案

使用 BROADCAST/EMIT ON 进行通信

$scope.$emit('myCustomEvent', 'Data to send');

// firing an event downwards
$scope.$broadcast('myCustomEvent', {
  someProp: 'Sending you an Object!' // send whatever you want
});

// listen for the event in the relevant $scope
$scope.$on('myCustomEvent', function (event, data) {
  console.log(data); // 'Data to send'
});

示例

plunkr: https://plnkr.co/edit/WemGxPytLLmPulml8xjK?p=preview

OR

您可以使用angular.extend在控制器之间进行通讯/链接

You can use angular.extend to communicate/link between controllers

app.controller('DashboardController', function($scope, $controller) {
        angular.extend(this, $controller('DashboardDeviceController', {$scope: $scope}));
});

这篇关于在按钮onClick中从另一个控制器调用功能的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！