1 @{ 2 Layout = null; 3 } 4 5 <!DOCTYPE html> 6 7 <html> 8 <head> 9 <meta name="viewport" content="width=device-width" /> 10 <title>Provider</title> 11 <script type="text/javascript" src="~/Scripts/angular.js"></script> 12 <script type="text/javascript"> 13 var myApp = angular.module("myApp", []); 14 myApp.config(function (providerServices01Provider,$interpolateProvider) { 15 providerServices01Provider.name = "张三"; 16 $interpolateProvider.startSymbol("##"); 17 $interpolateProvider.endSymbol("##"); 18 //$interpolateProvider 服务可以来对绑定数据进行操作 19 }); 20 21 myApp.provider("providerServices01", function () { 22 $provide.provider('providerServices01', function () {//自定义服务,通过module的第三个参数来定义,provider是唯一一个可以再config配置的service 23 //可以在config里面配置的属性 24 this.name = ""; 25 26 this.$get = function () { 27 var that = this; 28 var _name = ""; 29 var service = {}; 30 service.setName = function (name) { 31 _name = name; 32 } 33 service.getName = function (name) { 34 return _name; 35 } 36 service.getConfigName = function () { 37 return that.name + "123456"; 38 } 39 return service; 40 } 41 }); 42 }); 43 44 // 45 myApp.service("serviceServices01", function () {//不能直接返回字符串，因为内部是用new来实例化的所以可以直接用this来表示当前的service 46 //var _name = ""; 47 //var service = {}; 48 //service.setName = function (name) { 49 // _name = name; 50 //} 51 //service.getName = function (name) { 52 // return _name; 53 //} 54 //return service; 55 56 var _name = ""; 57 var service = {}; 58 this.setName = function (name) { 59 _name = name; 60 } 61 this.getName = function (name) { 62 return _name; 63 } 64 }); 65 66 67 myApp.factory("factoryServices01", function () { //可以直接返回字符串 68 var _name = ""; 69 var service = {}; 70 service.setName = function (name) { 71 _name = name; 72 } 73 service.getName = function (name) { 74 return _name; 75 } 76 return service; 77 }); 78 79 80 81 82 myApp.controller("firstController", ["$scope", "providerServices01", "serviceServices01", "factoryServices01", function ($scope, providerServices01, serviceServices01, factoryServices01) { 83 84 }]); 85 86 </script> 87 88 </head> 89 <body> 90 <div ng-app="myApp"> 91 <div ng-controller="firstController"> 92 93 {{name}} 94 ##name## 95 </div> 96 </div> 97 </body> 98 </html>