AngularJs练习Demo12Provider 

 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>

 

posted @ 2016-06-21 23:06  编程猴子  阅读(473)  评论(0)    收藏  举报