AngularJS popover:在鼠标输出时隐藏弹出模板

时间:2015-08-19 10:52:20

标签: javascript angularjs angular-ui-bootstrap popover

我正在使用 AngularJS' ui-bootstrap模块。这是我的标记:

<button class="btn btn-default btn-sm" type="button"
    popover-template="dynamicPopover.templateUrl"
    popover-trigger="click" id="custom_overview"
    popover-placement="bottom">Custom</button>

这是我的控制器:

$scope.dynamicPopover = {
    templateUrl : '../static/templates/popup-templates/datepicker.html'
};

这是我的弹出模板:

<div class="row" id="datepicker-container">
    <div class="col-sm-12 clearfix">
        <div class="col-sm-12">
            <span class="heading">From:</span>
            <input ng-model="timedata.fromDate" type="text" id="fromDate"
                class="form-control" datepicker-popup="dd-MM-yyyy"
                is-open="fromOpen.isOpen" ng-click="fromOpen.isOpen = true" placeholder="dd-mm-yyyy">
        </div>
        <div class="col-sm-12" style="margin-top:5px">
            <span class="heading">To:</span>
            <input ng-model="timedata.toDate" type="text" id="toDate"
                class="form-control" datepicker-popup="dd-MM-yyyy"
                is-open="toOpen.isOpen" ng-click="toOpen.isOpen = true" placeholder="dd-mm-yyyy">
                <div class="error"
                    ng-show="timedata.toDate <= timedata.fromDate && timedata.fromDate && timedata.toDate">
                    <span>'To' date cannot be less than 'From' date.</span>
                </div>
        </div>
    </div>
    <div class="col-sm-12" id="submit-button">
        <button class="btn btn-primary" ng-click="setInterval('custom')"
            ng-disabled="timedata.toDate <= timedata.fromDate || !timedata.toDate || !timedata.fromDate">
            Submit
        </button>
    </div>
</div>

正如您所看到的,我正在使用包含表单的弹出框模板填充弹出窗口。这是屏幕截图:

Screenshot of popover

当我点击&#39;自定义&#39;按钮。现在,当我将鼠标从模板上移开时,我想要隐藏这个弹出窗口和&#39;自定义&#39;标签。我该怎么办?

0 个答案:

没有答案