[angular]服务之4$window

朴灿烈づ我的快乐病毒、 2022-07-13 05:08 168阅读 0赞

<!DOCTYPE html>
    <html lang="en" ng-app="testServiceWindow">
    <head>
        <meta charset="UTF-8">
        <title>测试$window服务</title>
        <script src="../frameWork/angular.js"></script>
        <script src="../testService/testServiceWindow.js"></script>
    </head>
    <body ng-controller="ctr1.normal">
       <button ng-click="ask(false,'您输入的内容不正确')">提示</button>
       <button ng-click="ask(true,'确定删除？')">询问</button>
    
    <dir1>
        <controller-normal-title><span>我是title</span></controller-normal-title>
        <controller-normal-content><span>我是content</span></controller-normal-content>
    </dir1>
    </body>
    </html>

/**
     * 摘要：由于service在angular中的地位非常重要，所以得认真对待。
     *      服务是一个单例对象，与应用同生死，能够注入，是controller之间通讯的主要工具。
     *      (通信还可以用$emit,$broadcast,$on的形式，但这个方式有局限，两个controller得有关系，以后研究).
     *      服务依赖provider,这个provider一般是module.
     * service实例分析第四篇：$window服务
     * Created by liyanq on 16/12/26.
     */
    
    var testServiceWindow = angular.module("testServiceWindow",[]);
    var serviceConfirmFun = function ($window) {
        return function (msg) {
            return $window.confirm(msg) ? console.log("确定"): console.log("取消");
        };
    };
    var serviceConfirmAndAlertFun = function ($window,serviceConfirm) {
        return function (isConfirm,msg) {
            return isConfirm?serviceConfirm(msg):$window.alert(msg);
        };
    };
    var ctr1Fun = function($scope,ca){
      $scope.ask = function (isConfirm,msg) {
          ca(isConfirm,msg);
      }
    };
    var dirFun = function (serviceConfirmAndAlert) {
        var dir = {};
        dir.restrict = "E";
        dir.replace = false;
        dir.transclude = {
            title: "?controllerNormalTitle",
            content: "?controllerNormalContent"
        };
        dir.template = "<div>我是模版的内容</div>" +
            "<div ng-transclude='title'></div>"+
            "<button ng-click='ask(false,str)'>提示</button>" +
            "<button ng-click='ask(true,str)'>询问</button>" +
            "<div ng-transclude='content'></div>";
        dir.link = function (scope) {
            scope.ask = function (isConfirm,msg) {
                serviceConfirmAndAlert(isConfirm,msg);
            };
            scope.str = "ControllerNormal的link执行了";
        };
        return dir;
    };
    testServiceWindow.service("serviceConfirm",["$window", serviceConfirmFun]);
    testServiceWindow.service("serviceConfirmAndAlert",["$window","serviceConfirm", serviceConfirmAndAlertFun]);
    testServiceWindow.controller("ctr1.normal",["$scope","serviceConfirmAndAlert",ctr1Fun]);
    testServiceWindow.directive("dir1",["serviceConfirmAndAlert",dirFun]);