Question

我的指令有问题。如果我从弹出控制器调用行$scope.popup.show = false，它可以正常工作。如果我从子$scope.hideModal()调用contentDirective，则调用代码（在调试中检查）但$scope.popup.show值不会更改（在调试中值为“false”）并且弹出窗口不隐藏：/。

你有什么想法吗？：）

的index.html：

<popup title="sometitle">
  <contentDirective> </contentDirective>
</popup>

popup.html：

<div ng-show="popup.show">
    <div ng-transclude></div>
</div>

popup.js

.directive(....
    return {....
        scope: {}
    }
})
.controller(....
    $scope.hideModal = function()
    {
        $scope.popup.show = false;
    }
}]);

contentDirective.htlm（非孤立范围）

<div>
    <button onclick="changeSomethingAndHide()"/>
</div>

contentDirective.js

.controller(....
    $scope.changeSomethingAndHide = function()
    {
        //calls the parent function
        $scope.hideModal();
    }
}]);

也许我错过了什么......

谢谢！

Answer 1

当您处理被抄送的内容时，范围会变得有点棘手。

默认情况下不会继承被转换的范围（您可以更改此选项），它是一个＆＃34;兄弟＆＃34;封闭指令的范围，这有点令人困惑，但有充分的理由。

因此，默认情况下，您的contentDirective实际上无法在弹出指令中看到任何内容。当你在hideModal（）函数中设置$ scope.popup.show = false时，它所做的就是在contentDirective的范围内设置一个新变量，而不是在弹出窗口中设置一个变量＆＃39;范围。

解决此问题的两个选项：

您可以手动转换contentDirective，并使其与弹出指令使用相同的范围。有关详细信息，请参阅http://angular-tips.com/blog/2014/03/transclusion-and-scopes/。
您可以使用require关键字声明contentDirective，表示您希望访问弹出式指令的控制器。这将被传递到您的链接函数，您可以使用它来调用popup指令控制器上的方法。有关详细信息，请参阅https://egghead.io/lessons/angularjs-directive-to-directive-communication。

AngularJS：从子控制器隐藏弹出窗口（弹出内容）

1 个答案: