zoukankan      html  css  js  c++  java
  • angularJS依赖注入

    AngularJS的依赖注入有两种,一种是显式依赖注入,一种是隐式依赖注入,推荐用显式依赖注入,js压缩后不会因为参数问题而报错

    demo6.html

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
    </head>
    <body>
    <div ng-app="myApp">
        <div ng-controller="myController">
            {{data}}
        </div>
        <div ng-controller="otherController">
            {{otherData}}
        </div>
    </div>
    <script type="text/javascript" src="../common/angular/angularjs.js"></script>
    <script type="text/javascript" src="demo6.js"></script>
    </body>
    </html>

    demo6.js

    /**
     * Created by Administrator on 2017/7/23.
     */
    var myApp = angular.module('myApp', [], function () {
    
        })
    
        //显式依赖注入 myFactory 工厂
        .factory('myFactory', ['$window', function (a) {
            console.log("window:" + a);
            return "myFactory";
        }])
    
        /**
         * 1.隐式依赖注入,直接写 function ($scope) 而且参数名称必须是$scope,$scope这个单词不能改
         */
        .controller('myController', function ($scope) {
            $scope.data = '张三';
        })
    
        /**
         * 2.显式依赖注入 第二个参数用数组 [] 的方式表示,$scope 就是后面functioin的参数a,$filter 就是参数b,多个参数以此类推
         * 推荐使用显示依赖注入,一般function(a,b,c)里面的参数名,最好与数组[]前面的变量名一致,方便阅读
         */
        .controller('myController', ['$scope', '$filter', 'myFactory', function (a, b, c) {
            a.data = '张三';
            console.log(a);
            console.log(b('json')([1, 2, 3]));
            console.log(c);
        }])
    
    
    /**
     * 定义了一个全局的函数 otherController ,可以通过otherController.$inject 的方式 显式依赖注入 $scope ,
     * 这里的 a 就是指 $scope
     * @param a
     */
    function otherController(a) {
        a.otherData = '李四';
    }
    otherController.$inject = ['$scope'];
  • 相关阅读:
    POJ 3468 A Simple Problem with Integers(线段树区间求和)
    windows+Ubuntu双系统 windows引导修复
    CSDN博文大赛火爆开启
    TNS-12541,TNS-12560,TNS-00511,TNS-12542,TNS-12560,TNS-00512数据库启动监听报错
    MResource
    【LeetCode】【Python】Linked List Cycle
    中间件解析FDMEMTABLE.delta生成SQL的方法
    TDSTCPServerTransport 的Filters
    DATASNAP压缩过滤器的使用
    咏南CS插件开发框架也可BS方式部署
  • 原文地址:https://www.cnblogs.com/skyessay/p/7223917.html
Copyright © 2011-2022 走看看