IONIC----07.module

来源：互联网发布：mac 备份系统编辑：程序博客网时间：2024/05/24 05:37
<!doctype html><html><head><meta charset="utf-8"><meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no,width=device-width,height=device-height"><script src="./lib/js/ionic.bundle.min.js"></script><link rel="stylesheet" type="text/css" href="./lib/css/ionic.min.css"><title>Ionic</title></head><body ng-app="myApp" ng-controller="fristController">    <ion-header-bar class="bar-positive">        <h1 class="title">$ionicPopup</h1>    </ion-header-bar>    <ion-content padding="true">        <a class="button button-block button-calm" ng-click="showPopup();">定制弹出框/popup</a>        <a class="button button-block button-calm" ng-click="showConfirm();">确认框/confirm</a>        <a class="button button-block button-calm" ng-click="showAlert();">警告框alert</a>        <a class="button button-block button-calm" ng-click="showPrompt();">提示框/prompt</a>    </ion-content>    <ion-footer-bar class="bar-positive">        <h1 class="title">{{status}}</h1>    </ion-footer-bar></body></html><script>angular.module("myApp", ["ionic"]).controller("fristController", function($scope, $ionicPopup, $timeout) {    $scope.status = "";    // 显示定制弹出框    $scope.showPopup = function() {        $scope.data = {}        // 调用$ionicPopup弹出定制弹出框        $ionicPopup.show({            template: "<input type='password' ng-model='data.wifi'>",            title: "请输入密码",            subTitle: "密码为8位",            scope: $scope,            buttons: [                { text: "取消" },                {                    text: "<b>保存</b>",                    type: "button-positive",                    onTap: function(e) {                        return $scope.data.wifi;                    }                }            ]        })        .then(function(res) {            $scope.status = ["密码到手了",":",res].join(" ");        });    };    // 确认弹出框    $scope.showConfirm = function() {        $ionicPopup.confirm({            title: "删除信息",            template: "你确定要删除次条信息吗？",            okText:"OK"        })        .then(function(res) {            if(res) {                $scope.status = "已删除！";            } else {                $scope.status = "取消删除！";            }        });    };    //警告弹出框    $scope.showAlert = function() {        $ionicPopup.alert({            title: "此文件禁止删除",            template: "删除此文件可能会导致其它问题！"        })        .then(function(res) {            $scope.status = "";        });    };    //输入提示框    $scope.showPrompt = function(){        //todo....        $ionicPopup.prompt({            title: "请输入取款金额：",            template: "取款金额将从你的银行卡扣除"        })        .then(function(res) {            $scope.status = "取款成功，取款金额是："+res;        });    }});</script>
GITHUB
0 0