angularjs框架的悬浮提示框实现

angularjs框架的悬浮提示框实现

第一步：需要添加js引用：

<script src="../dist/angular-popups.js"></script>

第二步：在JS中引用这个控件

有的可以这样写：

reliers.push("angular-popups");

有的可以这样写：

<script>angular.module('examples', ['angular-popups']);</script>

第三步：写html代码

如果只是单个显示那很简单，如下：

<button id="btn" ng-click="bubble.open = true">打开气泡</button><bubble ng-if="bubble.open" for="btn" close="bubble.open=false">hello world</bubble>

如果是循环显示，那么需要修改一下

<a ng-show="isShow" id={{id}} ng-mouseenter="bubble.open = true" ng-mouseleave="bubble.open = false">{{name}}</a><bubble ng-if="isShow && bubble.open" for={{id}} close="bubble.open = false">{{msg}}</bubble>