Question

这是我的问题：当我双击一个数组的行时，我想让我的页面的几个部分消失。问题是......我不知道如何做到这一点。

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

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

我试过这样做，在控制器里面＃34;表＆＃34; ：

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

当我双击时，hideAlias的值从false变为true，反之亦然。但是，页面上没有任何反应（没有任何内容隐藏）

有任何线索吗？非常感谢

编辑：

控制器定义：函数表（$ scope，$ http，$ route）{

Answer 1

mainWindow控制器上不存在变量hideAlias。您要做的是在mainWindow控制器和表控制器之间共享数据。

有几种方法可以做到这一点，我会告诉你一个

通过Event emmiters在控制器之间共享数据

在高级别，控制器表将数据发送到Controller MainWindow，控制器表是控制器MainWindow的子级，所以这里是你如何使用事件emmiters：

    Controller mainWindow:


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

          $scope.hideAlias = data.hideAlias;

    });

这将告诉控制器mainWindow监听EventFromTableController事件。该事件将包含附加的数据。在这种情况下，它将保存来自子控制器的hideAlias值。

现在在控制器表：

    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值发送到父控制器（mainWindow）。

这样，ng-hide将有一个hideAlias范围变量来评估它的状态。

Answer 2

您可以通过简单的方式实现这一目标。

在你的案例控制器中，mainWindow是父控制器和控制器，table是子控制器。

为父控制器创建一个对象，并在双击事件中访问或更改子控制器的值。

var app = angular.module('myapp',[]);
app.controller('mainWindow',function($scope){
    $scope.parentobj = {};
    $scope.parentobj.hideAlias = false;
});
app.controller('table',function($scope){
    $scope.dblclicktest=function()
    {
        $scope.parentobj.hideAlias=true;
    }
});

并使用html中的父对象范围隐藏Div

<div id="mainWindow" ng-hide="parentobj.hideAlias" ng-controller="mainWindow">

以下是JSFiddle

在JSFiddle中，双击 AA 将隐藏div。

AngularJS - 使用不同的ng-controller进行隐藏

2 个答案: