uib-dropdown outside与is-open一起使用时无法正常工作

时间:2016-10-19 08:02:28

标签: angularjs drop-down-menu angular-ui-bootstrap

我有这个模板:

  <DataGridTemplateColumn Header="Web">
                <DataGridTemplateColumn.CellTemplate>
                    <DataTemplate>
                        <Grid>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="auto" />
                                <ColumnDefinition Width="auto" />
                            </Grid.ColumnDefinitions>
                            <CheckBox Grid.Column="0" Margin="4,0" IsChecked="{Binding Webs.IsSelected,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}">
                                <CheckBox.Style>
                                    <Style TargetType="CheckBox">
                                        <Style.Triggers>
                                            <DataTrigger Binding="{Binding Webs}" Value="{x:Null}">
                                                <Setter Property="IsEnabled" Value="false"></Setter>
                                            </DataTrigger>
                                        </Style.Triggers>
                                    </Style>
                                </CheckBox.Style>
                            </CheckBox>
                            <Button Grid.Column="1" Content="Detail" Margin="3,1" />
                        </Grid>
                    </DataTemplate>
                </DataGridTemplateColumn.CellTemplate>
            </DataGridTemplateColumn>

            <DataGridTemplateColumn Header="Flange">
                <DataGridTemplateColumn.CellTemplate>
                    <DataTemplate>
                        <Grid>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="auto" />
                                <ColumnDefinition Width="auto" />
                            </Grid.ColumnDefinitions>
                            <CheckBox Grid.Column="0" Margin="4,0" IsChecked="{Binding Flanges.IsSelected,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}">
                                <CheckBox.Style>
                                    <Style TargetType="CheckBox">
                                        <Style.Triggers>
                                            <DataTrigger Binding="{Binding Flanges}" Value="{x:Null}">
                                                <Setter Property="IsEnabled" Value="false"></Setter>
                                            </DataTrigger>
                                        </Style.Triggers>
                                    </Style>
                                </CheckBox.Style>
                            </CheckBox>
                            <Button Grid.Column="1" Content="Detail" Margin="3,1" />
                        </Grid>
                    </DataTemplate>
                </DataGridTemplateColumn.CellTemplate>
            </DataGridTemplateColumn>

我想打开 <div class="col-xs-1 " ng-click="isOpen=!isOpen"> <div class="col-xs-12"> <div class="dropdown" uib-dropdown auto-close="outsideClick" is-open="isOpen"> <a href="#" class="dropdown-toggle" uib-dropdown-toggle> <i class="glyphicon glyphicon-option-vertical"></i> </a> <ul class="dropdown-menu" uib-dropdown-menu=""> <li ng-repeat="service in account.services"> <a href="#"> <span> {{service.name}} </span> </a> </li> </ul> </div> </div> </div> ,当用户点击dropdown标签上的课程a或整个drop-down(这是一个矩形)时,我试过了通过使用div点击其中包含div来手动打开下拉菜单,通过此方法可以正常工作,但是当我点击任何外部元素时,ng-click="isOpen=!isOpen"还没有关闭的另一个问题,我使用dropdown,但没有帮助。

任何想法如何让它运作?

1 个答案:

答案 0 :(得分:2)

问题是因为事件传播。 uib-dropdown-toggle指令将更改is-open标志,外部div上的点击正在将其更改回来。

请找到解决方案here