Angularjs 单击弹出窗口和按钮时切换按钮

Angularjs 单击弹出窗口和按钮时切换按钮,angularjs,angular-ui-bootstrap,Angularjs,Angular Ui Bootstrap,代码如下: 我有两个按钮。一个是“State1”,另一个是“State2” 开始时,它处于“状态2”按钮中。然后我点击“State2”按钮,它切换到“State1”按钮,也生成popover 我想点击“State1”按钮和弹出窗口,然后它将从“State1”按钮变为“State2”按钮。我使用了popover trigger=“outsideClick”,但它不起作用。请告知。谢谢 <div ng-click="Ctrl.Check = !Ctrl.Check" popover-trigg

代码如下:

我有两个按钮。一个是“State1”,另一个是“State2”

开始时,它处于“状态2”按钮中。然后我点击“State2”按钮,它切换到“State1”按钮,也生成popover

我想点击“State1”按钮和弹出窗口,然后它将从“State1”按钮变为“State2”按钮。我使用了popover trigger=“outsideClick”,但它不起作用。请告知。谢谢

<div ng-click="Ctrl.Check = !Ctrl.Check" popover-trigger="outsideClick">
            <a ng-class="{'btn-danger': !Ctrl.Check, 'btn-default': Ctrl.Check }" confirm-link="Ctrl.deleteCurrent(Ctrl.A)" uib-popover="I appeared on focus! Click away and I'll vanish..." popover-trigger="outsideClick" popover-placement="right">
                {{ Ctrl.Check ? 'State1' : 'State2' }}
            </a>
</div>

{{Ctrl.Check?'State1':'State2'}
您缺少popover触发器中的
'
,并且不需要div本身的第一个:

<div ng-click="Ctrl.Check = !Ctrl.Check">
        <a ng-class="{'btn-danger': !Ctrl.Check, 'btn-default': Ctrl.Check }" confirm-link="Ctrl.deleteCurrent(Ctrl.A)" uib-popover="I appeared on focus! Click away and I'll vanish..." popover-trigger="'outsideClick'" popover-placement="right">
            {{ Ctrl.Check ? 'State1' : 'State2' }}
        </a>

{{Ctrl.Check?'State1':'State2'}

您缺少popover触发器中的
'
,并且不需要div本身的第一个:

<div ng-click="Ctrl.Check = !Ctrl.Check">
        <a ng-class="{'btn-danger': !Ctrl.Check, 'btn-default': Ctrl.Check }" confirm-link="Ctrl.deleteCurrent(Ctrl.A)" uib-popover="I appeared on focus! Click away and I'll vanish..." popover-trigger="'outsideClick'" popover-placement="right">
            {{ Ctrl.Check ? 'State1' : 'State2' }}
        </a>

{{Ctrl.Check?'State1':'State2'}

这是普朗克

我所做的

      <a 
            ng-class="{'btn-danger': !isOpen, 'btn-default': isOpen }" 
            state-change-capture 
            confirm-link="Ctrl.deleteCurrent(Ctrl.A)" 
            uib-popover="I appeared on focus! Click away and I'll vanish..." 
            popover-trigger="'outsideClick'" 
            popover-is-open="isOpen" 
            ng-click="isOpen = !isOpen"
            popover-placement="right">
                {{ isOpen ? 'State1' : 'State2' }}
      </a>
为uib popover添加了一个名为
popover is open=“isOpen”
它告诉用户popover是否可见,并根据设置状态1或2

此外,如果您需要观察它,则在控制器上添加一块手表,以防您需要它。

这是plunker

我所做的

      <a 
            ng-class="{'btn-danger': !isOpen, 'btn-default': isOpen }" 
            state-change-capture 
            confirm-link="Ctrl.deleteCurrent(Ctrl.A)" 
            uib-popover="I appeared on focus! Click away and I'll vanish..." 
            popover-trigger="'outsideClick'" 
            popover-is-open="isOpen" 
            ng-click="isOpen = !isOpen"
            popover-placement="right">
                {{ isOpen ? 'State1' : 'State2' }}
      </a>
为uib popover添加了一个名为
popover is open=“isOpen”
它告诉用户popover是否可见,并根据设置状态1或2



此外,如果您需要观察,请在控制器上添加一块手表,以备不时之需。

popver触发器指令代码?@Mayur我添加了,请检查。Thankspopver trigger指令是UI boostrap中的默认功能,只需popover trigger=“outsideClick”如果您可以创建一个plunker或fiddle,它会更有用,因为您的问题有点含糊不清@AngularFan@Yaser是的。popver触发器指令的代码?@Mayur我添加了,请检查。Thankspopver trigger指令是UI boostrap中的默认功能,只需popover trigger=“outsideClick”如果您可以创建一个plunker或fiddle,它会更有用,因为您的问题有点含糊不清@AngularFan@Yaser是的。是的,它隐藏了一个爆米花。但它不会切换回“State2”按钮,而是隐藏了popover。但它不会切换回“State2”按钮i delete ng controller=“PopoverDemoCtrl”在中,它还能工作吗$scope.isOpen=false这是否必要?$scope.isOpen=false是必要的,以便在开始时不显示弹出窗口,同时保持该检查的正确性state2@AngularFanplunker和这个解决方案回答了你的问题吗?我理解你的答案。但我的案子还是不起作用。我正在调试它。因为我没有使用uib popover,所以我在另一个模板(xxx.html)中使用了我的popover。你知道吗?我在中删除了ng controller=“PopoverDemoCtrl”,它仍然有效吗$scope.isOpen=false这是否必要?$scope.isOpen=false是必要的,以便在开始时不显示弹出窗口,同时保持该检查的正确性state2@AngularFanplunker和这个解决方案回答了你的问题吗?我理解你的答案。但我的案子还是不起作用。我正在调试它。因为我没有使用uib popover,所以我在另一个模板(xxx.html)中使用了我的popover。你知道吗?