[angular]服务之3$injector

小咪咪 2022-07-13 05:07 178阅读 0赞

<!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>测试service的injector</title>
        <script src="../frameWork/angular.js"></script>
        <script src="../testService/testServiceInjector.js"></script>
    </head>
    <body>
    <div ng-app="testServiceNormalModule">
        <div ng-controller="ctr1" ng-click="show()">fff
    
        </div>
        <div ng-controller="ctr2"></div>ggg
    </div>
    </body>
    </html>

/**
     * 摘要：由于service在angular中的地位非常重要，所以得认真对待。
     *      服务是一个单例对象，与应用同生死，能够注入，是controller之间通讯的主要工具。
     *      (通信还可以用$emit,$broadcast,$on的形式，但这个方式有局限，两个controller得有关系，以后研究).
     *      服务依赖provider,这个provider一般是module.
     * service实例分析第三篇：Injector分析
     * Created by liyanq on 16/12/24.
     */
    
    /**$injector是自带的服务，能和$scope一样使用，可以在controller中使用其它服务的地方使用。
     * 1，get:$injector.get(name, [caller]);Return an instance of the service.返回服务的实例
     * 2，invoke:$injector.invoke(fn, [self], [locals]);第二个参数是self The `this` for the invoked method.
     * 3，has:Allows the user to query if the particular service exists.
     * 4，annotate:Returns an array of service names which the function is requesting for injection.
     * 5，angular.injector里面的参数是服务名称组成的数组。没有练习，貌似是和外界打交道用，用的时候再说吧。
     * */
    var  moduleNormal = angular.module("testServiceNormalModule",[]);
    var service1fun = function (window) {
        this.gameName = "service1.gameName";
    };
    moduleNormal.service("service1",["$window",service1fun]);
    moduleNormal.controller("ctr1",["$scope","$injector",function ($scope,$injector) {
        $injector.invoke(["service1",function (service1) {//里面可以用service1了。
            console.log("ctr1中的service1服务"+service1.gameName);
            console.log($injector.get("service1"));
            console.log($injector.annotate(service1fun));//["window"]
            console.log($injector.has("service1"));//true
        }]);
    }]).controller("ctr2",["$scope","service1",function ($scope,service1) {
        console.log("ctr2中的service1服务"+service1.gameName);
    
    }]);