通过AngularJs自定义服务实现代码共用实例

最新推荐文章于 2020-08-08 19:51:04 发布

K'illCode

最新推荐文章于 2020-08-08 19:51:04 发布

阅读量337

点赞数

分类专栏： angularJS 文章标签： angularJs

本文链接：https://blog.csdn.net/Dome_/article/details/79277581

版权

angularJS 专栏收录该内容

37 篇文章 0 订阅

订阅专栏

通过AngularJs自定义服务实现代码共用实例：

html部分：

 
       01<body ng-app="app">
 
       02    <div ng-controller="ctr2">
 
       03        <table cellpadding="0" cellspacing="0">
 
       04            <thead>
 
       05            <tr>
 
       06                <td>网站名称</td>
 
       07                <td>网站地址</td>
 
       08            </tr>
 
       09            </thead>
 
       10            <tbody>
 
       11            <tr ng-repeat="(key, value) in data.data">
 
       12                <td>{{value.webname}}</td>
 
       13                <td>{{value.weburl}}</td>
 
       14            </tr>
 
       15            </tbody>
 
       16        </table>
 
       17        <button ng-click="deleteAll();">删除所有数据</button>
 
       18    </div>
 
       19</body>

JavaScript部分：

 
       01<script type="text/javascript" src="http://www.zymseo.com/js/demo.js"></script>
 
       02<script type="text/javascript" src="http://www.zymseo.com/js/angular.min.js"></script>
 
       03<script type="text/javascript">
 
       04    var m = angular.module('app', []);
 
       05    m.factory('zymBlog', ['$http', function($http){
 
       06        return {
 
       07            'arryData' : {'data': []},
 
       08            'get' : function(){
 
       09                var _this = this;
 
       10                return $http({
 
       11                    'url' : './1.php',
 
       12                    'method' : 'post',
 
       13                }).then(function(result){
 
       14                    _this.arryData.data = result.data;
 
       15                    return _this.arryData;
 
       16                });
 
       17            },
 
       18            'removeAll' : function(){
 
       19                var _this = this;
 
       20                _this.arryData.data = [];
 
       21            }
 
       22        }
 
       23    }]);
 
       24    m.controller('ctr2', ['$scope', 'zymBlog', function($scope, zymBlog){
 
       25        zymBlog.get().then(function(result){
 
       26            $scope.data = result;
 
       27        });
 
       28        $scope.deleteAll = function(){
 
       29            zymBlog.removeAll();
 
       30        }
 
       31    }]);
 
       32</script>

PHP部分：

 
       1<?php
 
       2    header('Content-type:text/html;charset="utf-8"');
 
       3 
 
       4    $arry = array(
 
       5        array('webname'=>'赵一鸣个人技术博客', 'weburl'=>'http://www.zymseo.com'),
 
       6        array('webname'=>'太原雅辉装修网', 'weburl'=>'http://www.0351zhuangxiu.com')
 
       7    );
 
       8     
 
       9    echo json_encode($arry);