AngularJs练习Demo12Provider

程序员爱鹏技术 2022年11月18日

0 收藏 924 点赞 4,846 浏览 1720 个字

 @{
     Layout = null;
 } <!DOCTYPE html> <html>
 <head>
     <meta name="viewport" content="width=device-width" />
     <title>Provider</title>
     <script type="text/javascript" src="~/Scripts/angular.js"></script>
     <script type="text/javascript">
         var myApp = angular.module("myApp", []);
         myApp.config(function (providerServices01Provider,$interpolateProvider) {
             providerServices01Provider.name = "张三";
             $interpolateProvider.startSymbol("##");
             $interpolateProvider.endSymbol("##");
             //$interpolateProvider 服务可以来对绑定数据进行操作
         });         myApp.provider("providerServices01", function () {
             $provide.provider('providerServices01', function () {//自定义服务,通过module的第三个参数来定义,provider是唯一一个可以再config配置的service
                 //可以在config里面配置的属性
                 this.name = "";                 this.$get = function () {
                     var that = this;
                     var _name = "";
                     var service = {};
                     service.setName = function (name) {
                         _name = name;
                     }
                     service.getName = function (name) {
                         return _name;
                     }
                     service.getConfigName = function () {
                         return that.name + "123456";
                     }
                     return service;
                 }
             });
         });         //
         myApp.service("serviceServices01", function () {//不能直接返回字符串，因为内部是用new来实例化的所以可以直接用this来表示当前的service
             //var _name = "";
             //var service = {};
             //service.setName = function (name) {
             //    _name = name;
             //}
             //service.getName = function (name) {
             //    return _name;
             //}
             //return service;             var _name = "";
             var service = {};
             this.setName = function (name) {
                 _name = name;
             }
             this.getName = function (name) {
                 return _name;
             }
         });         myApp.factory("factoryServices01", function () { //可以直接返回字符串
             var _name = "";
             var service = {};
             service.setName = function (name) {
                 _name = name;
             }
             service.getName = function (name) {
                 return _name;
             }
             return service;
         });         myApp.controller("firstController", ["$scope", "providerServices01", "serviceServices01", "factoryServices01", function ($scope, providerServices01, serviceServices01, factoryServices01) {         }]);     </script> </head>
 <body>
     <div ng-app="myApp">
         <div ng-controller="firstController">             {{name}}
             ##name##
         </div>
     </div>
 </body>
 </html>