如果用户仅开始在输入字段中输入内容,如何显示弹出式窗口?

时间:2018-09-18 07:26:57

标签: html angularjs twitter-bootstrap-3 angular-ui-bootstrap uipopover

我有一个输入字段,我只想在用户输入该字段时才显示一个弹出框,并且我不想在输入字段为空时第一次显示该弹出框。 我已经编写了以下代码,但它是我第一次单击时显示的弹出窗口!有什么办法解决吗? 这是显示问题的plnkr:

http://plnkr.co/edit/d6WzzJYgDHlBmx1Pfb9L?p=preview

<input type="text"
    value="Click me!" 
    ng-model="value"
    popover-is-open="!!value"  
    uib-popover="This must be shown when use has typed value"  
    popover-trigger="focus"
    class="form-control">

4 个答案:

答案 0 :(得分:0)

请尝试使用此代码,我已更改单击以更改。

<div ng-controller="PopoverDemoCtrl">
  <br />
  <br />
  <br />
    <input type="text"
    value="Click me!" 
    ng-model="value"
    popover-is-open="!!value"  
    uib-popover="This must be shown when use has typed value"  
    popover-trigger="change"
    class="form-control">

    <br />
    {{value}} -- {{!!value}}
</div>

告诉我

谢谢!

答案 1 :(得分:0)

我找到了一种获得期望结果的方法,方法如下:

<input type="text"
    value="Click me!" 
    ng-model="value"
    popover-is-open="!!value && popUpOpen"  
    uib-popover="This must be shown when use has typed value"  
    popover-trigger="none"
    ng-blur="popUpOpen = false"
    ng-focus="popUpOpen = true"
    class="form-control">

答案 2 :(得分:0)

我知道您找到了一个解决方案,它也使用uib并使用触发器'mouseclick'

<input vm.detectChange popover-append-to-body="true"  popover-placement="right" uib-popover-template="'popup.html'" popover-is-open="isOpen" popover-trigger="mouseclick" popover-title="Popup: ">

答案 3 :(得分:0)

我尝试了许多其他解决方案,但这只对我有用。

我通过添加一个隐藏可见性的新按钮并用这个按钮绑定弹出框来解决这个问题。在输入点击输入时,我手动打开了这个弹出窗口。