AngularJS - NG隐藏不同的NG-控制器 [英] AngularJS - ng-hide with different ng-controller

问题描述

下面是我的问题：
当我在一个阵列的行双击，我要让我的消失第几部分组成。问题是...我不知道如何做到这一点。

here is my problem : When I double click in a row of an array, I want to make disappear several parts of my page. The problem is...I don't figure out how to do this.

基本上，这里是我的html文件：

Basically, here is my html file:

<div id="mainWindow" ng-hide="hideAlias" ng-controller="mainWindow">
...
<div id="table{{workspace.name}}" class="table" ng-controller="table" >
    <table id="mainTable" class="mainTable">
        <tr class="tableHeader">
            <th>AA</th>
            <th>BB</th>     
            <th>Options</th>
        </tr>
        <tr class="tableRows" id ="{{row}}" ng-repeat = "row in rowstable">
            <td ng-dblclick="dblclick()" >{{row.AA}} </td>
            <td>{{row.server}} <input type="button" ng-click="clickOnDeleteServer(row.BB)" value="X" style="float:right"/></td>
            <td>
                <input type="button" ng-click="clickOnView()" value="View"></input>
                <input type="button" ng-click="clickOnDelete(row.AA)" value="Delete"></input>   
            </td>   
        </tr>

    </table>
</div>

...
</div>

我试图做到这一点，控制器内的表：

I have tried to do this, inside the controller "table" :

$scope.dblclick = function(){
    mainWindow.hideAlias=!mainWindow.hideAlias
}

hideAlias​​的值从假到真时更改我双击，反之亦然。然而，什么也没有发生在页面上（没有被隐藏）

The value of hideAlias change from false to true when I double click, and vice-versa. However, nothing happens on the page (nothing gets hidden)

任何线索？非常感谢

编辑：

控制器的定义：
功能表（$范围，$ HTTP，$路径）{

controller definition : function table($scope, $http, $route){

推荐答案

变量hideAlias​​不MainWindow的控制器上存在。
你想要做什么的主窗口控制器和台控制器之间共享数据。

the variable hideAlias doesn't exist on the mainWindow controller. What you want to do is share data between the mainWindow controller and the table controller.

有这样做的几种方法，我会告诉你一

There's a few ways of doing this, I'll show you one

通过事件emmiters控制器之间共享数据

在较高的水平，控制器将表数据发送到控制器的主窗口和控制器表是控制主窗口的孩子，所以这里是你如何与事件emmiters做到这一点：

At high level, controller Table will send data to Controller MainWindow, and controller Table is child of controller MainWindow, so here's how you do it with event emmiters:

    Controller mainWindow:


    $scope.$on('EventFromTableController',function(data){

          $scope.hideAlias = data.hideAlias;

    });

这将告诉控制器的主窗口来侦听EventFromTableController事件。这一事件将包含附加的数据。在这种情况下，将持有从子控制器hideAlias​​值

This will tell controller mainWindow to listen for the EventFromTableController event. That event will contain data attached. In this case it will hold the hideAlias value from the child controller.

现在在控制器表：

    Controller table:

    var tableHideAlias = true; // initialize it to true or false

    $scope.dblclick = function(){
        //change the local tableHideAlias state
        tableHideAlias = !tableHideAlias;

        // emit the new hideAlias value
        $scope.$emit('EventFromTableController',{hideAlias: tableHideAlias}); 

    }

所以DBLCLICK执行时，它会发出新的hideAlias​​值父​​控制器（的主窗口）。

so when dblclick executes, it will send the new hideAlias value to the parent controller (mainWindow).

这样，NG隐藏会有一个hideAlias​​范围的变量来评估它的状态。

This way, ng-hide will have a hideAlias scope variable to evaluate it's state.

这篇关于AngularJS - NG隐藏不同的NG-控制器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！