36、AngularJs通过service自定义服务

阅读() @2018-10-29 18:16:10

与factory类似,AngularJs也可以通过service来自定义服务,只是在return返回数据的写法上稍有不同,具体代码如下:

HTML部分:

<body ng-app="app" ng-controller="ctr" ng-cloak class="ng-cloak">
	<table cellpadding="0" cellspacing="0">
		<thead>
			<tr>
				<td>网站名称</td>
				<td>网站地址</td>
			</tr>
		</thead>
		<tbody>
			<tr ng-repeat="(key, value) in data">
				<td>{{value.webname}}</td>
				<td>{{value.weburl}}</td>
			</tr>
		</tbody>
	</table>
</body>

JavaScript部分:

<script type="text/javascript" src="http://www.zymseo.com/js/angular.min.js"></script>
<script type="text/javascript">
	var m = angular.module('app', []);
	
	m.service('zymBlog', ['$http', function($http){
		this.get = function(){
			return $http({
				'url' : './1.php',
				'method' : 'post'
			}).then(function(result){
				return result.data;
			});
		}
	}]);
	
	m.controller('ctr', ['$scope', 'zymBlog', function($scope, zymBlog){
		zymBlog.get().then(function(result){
			$scope.data = result;
		});
	}]);
</script>

PHP部分:

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

可以仔细对比一下service与factory自定义服务的区别!

微信二维码