加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 综合聚焦 > 服务器 > 安全 > 正文

angularJs页面弹框的实现

发布时间:2020-12-17 09:19:47 所属栏目:安全 来源:网络整理
导读:弹框需要三样东西,点击发生弹框事件的按钮,弹框页面,js逻辑。 下面用一个实例解释: 1,按钮:按钮的点击事件为toSendEmail() button type = "button" ng-click= "vc.toSendEmail()" class = "button button-icon ion-ios-email-outline" style= "margin-

弹框需要三样东西,点击发生弹框事件的按钮,弹框页面,js逻辑。
下面用一个实例解释:
1,按钮:按钮的点击事件为toSendEmail()

<button type="button"  ng-click="vc.toSendEmail()" class="button button-icon ion-ios-email-outline" style="margin-right: -5px;"></button>

2,弹框页面:新建一个html,命名为emailPop.html,代码如下:

<img ng-click="searchPopup.close()" src="img/login/close.png" style="position:absolute;top:-12px;right:-12px;z-index:99999;width:30px;">
<form name="form" style="margin:-10px;">
    <div class="list input-border">
        <label class="item item-input padding-right">
            <span class="input-label">客户邮箱</span>
            <input type="text" placeholder="请输入客户邮箱地址">
        </label>

    </div>
</form>

3,js部分:

$scope.vc = {
    toSendEmail:function(){
            $scope.searchPopup = $ionicPopup.show({
                templateUrl:'app/requirement/view/pop/emailPop.html',title:'弹框标题',scope: $scope,backdropClickToClose:true,cssClass:'form-popup',animation: 'slide-in-up',buttons:[{
                    text: '<b>取 消</b>',type: 'button-light',onTap: function(e) {
                        $scope.searchPopup.close();
                    }
                },{
                    text: '<b>发 送</b>',type: 'button-positive',//判断邮箱是否为空
// onTap: function(e) {
// if($scope.customerEmail == ''){
// utils.JAlert.alertOnce("请填写客户邮箱!");
// return false;
// }
// search();
// }
                }]
            });
        },}

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读