StopPropagation() - uib-accordion 标头中的复选框 - AngularJS

Question

手风琴标题内的复选框有问题。

目的：

标题中的复选框表示该部分是否正在使用。

用户操作：

有两种方法可以将复选框的值设置为 true。

第一个选项是单击复选框本身。发生这种情况时，该部分应该打开并且值应该为真。

第二个选项是单击标题本身。发生此操作时，该部分应打开并且值应为 true。

但是当复选框的值为真时，它只能通过单击复选框本身来更改。所以这意味着当用户关闭选项卡并选中复选框时，选项卡应该关闭并且复选框应该保持选中状态。

问题：

我正在使用$event.stopPropagation(); 来更新标题内复选框的值。但问题是 $event.stopPropagation();阻止父母在发生变化时得到通知。所以它只更新复选框值而不是部分。

Plunker 操作：

通过单击标题本身打开选项卡。该部分打开，复选框的值设置为 true。在此之后单击复选框以将值设置为 false。如您所见，它将值设置为 false 但该部分将保持打开状态，因为它被 $event.stopPropagation(); 阻止了

Plunker：http://plnkr.co/edit/CyM6d8Or75SqRGavTYyI?p=preview

谢谢！

布伦特

Answer 1

$event.stopPropagation() 防止调用手风琴组指令的 toggleOpen 事件（展开和折叠手风琴）。

在这种情况下，您可以在checkboxClicked 事件中展开/折叠手风琴组：

$scope.checkboxClicked = function(tab,e){ 
    $scope.accordion.groups[0].isOpen = !$scope.accordion.groups[0].isOpen; //expand and collapse the accordion group 
    e.stopPropagation();
}

示例

Forked and modified plunker