文档章节

初学angularJS笔记之Services服务

programDu
 programDu
发布于 2015/09/13 18:15
字数 192
阅读 39
收藏 0

    HTML代码

<body ng-app="app" style="padding: 10px;">
  <div ng-controller="CtrlSevers">
   <h1>{{msg}}</h1>
   <h3>{{uname}}</h3>
   <a href="{{urls}}">ProgramDu</a>
   <br />
   <h3>{{data.msg}}</h3>
   <h4>大家好,我是{{user.userName}},我的性别是{{user.userSex}}</h4>
   <h5>{{ut}}</h5>
  </div>
 </body>

JavaScript代码

angular.module('app',[])
.value('uname','programDu')   //变量
.constant('urls','http://www.websevc.com')   //常量
.factory('Data',function(){
 return {
  msg:'你好',
  setMsg:function(){
   this.msg = 'ProgramDu';
  }
 }
})

.service('User',function(){
 this.userName = 'ProgramDu';
 this.userSex = '男';
 this.setUser = function(){
  return '大家好,我是'+this.userName+',我的性别是'+this.userSex;
 }
})

.controller('CtrlSevers',function($scope,uname,urls,Data,User){
 $scope.msg = 'ss';
 $scope.uname = uname;
 $scope.urls = urls;
 
 $scope.data = Data;
 Data.setMsg();
 
 $scope.user = User;
 $scope.ut = User.setUser();
 
})

factory 方法解释,在方法里面多套了一层 return

.factory('Data',function(){
 return new fun();
})

function fun(){
 this.userName = 'ProgramDu';
 this.userSex = '男';
 this.setUser = function(){
  return '大家好,我是'+this.userName+',我的性别是'+this.userSex;
 }
}


© 著作权归作者所有

programDu
粉丝 1
博文 17
码字总数 2081
作品 0
宁波
前端工程师
私信 提问
《AngularJS学习整理》系列分享专栏

《AngularJS学习整理》系列分享专栏 《AngularJS学习整理》已整理成PDF文档,点击可直接下载至本地查阅 https://www.webfalse.com/read/201748.html 文章 教你用AngularJS框架一行JS代码实现...

开元中国2015
2018/11/09
189
0
初学angular 看到网上有angular js 也有angular2 ,到angular官网发现最近版本是6了,那么现在大家说的angular js到底是什么啊?

初学angular 看到网上有angular js 也有angular2 ,到angular官网发现最近版本是6了,那么现在大家说的angular js到底是什么啊? angular2和现在官网的angular6 就是 angular js 只是版本不同...

Jordan裔
2018/05/19
1K
4
  AngularJS中serivce,factory,provider的区别

一、service引导 刚开始学习Angular的时候,经常被误解和被初学者问到的组件是 service(), factory(), 和 provide()这几个方法之间的差别。This is where we'll start the twenty-five days ...

武文海
2015/04/29
4K
0
Migrating a SpringWebMVC App from JSP to AngularJS

Migrating a Spring Web MVC application from JSP to AngularJS Engineering Michael Isvy August 19, 2015 Note on authors This post is a guest post by Han Lim and Tony Nguyen.Han an......

miscellanea
2015/08/24
220
0
AngularJS - Top 6 Concepts that Developers Loved

This article represents top 6 popular AngularJS topics that has been used most by the AngularJS developer community to date. The inference is derived based on number of tagged d......

perfectspr
2014/12/03
55
0

没有更多内容

加载失败,请刷新页面

加载更多

安全组和云防火墙的区别

前言 熟悉云平台的朋友可能都会注意到这样一个事情:无论公有云还是私有云,创建虚拟机的时候都需要选择安全组,来对虚拟机进行安全防护;有的云平台在VPC里,还能选择防火墙,ZStack在3.6版...

ZStack社区版
15分钟前
1
0
教育性app开发的重要性和好处

在这个精通技术的世界中,流行的app主导着无聊的教育系统。当我们将技术和教育结合在一起时,它将带来当代以及强大的学习资源。因此,将教育移动app集成到您的学习过程中,并根据自己的信念把...

a429011717
16分钟前
1
0
IE6/7/8如何兼容CSS3属性

本文转载于:专业的前端网站➩IE6/7/8如何兼容CSS3属性 最近在工作中总是要求IE8兼容CSS3属性,在网上搜了搜主要是引入了一个htc文件(ie-css3.htc或者PIE.htc。个人认为这两个文件的作用差不...

前端老手
31分钟前
2
0
手把手教你ALLEGRO的约束规则的设置教程!

约束规则的设置 分三步, 定义规则(一、基本约束规则设置:1、线间距设置;2、线宽设置;3、设置过孔;4、区域约束规则设置;5、设置阻抗;6、设置走线的长度范围;7、设置等长:7.1、不过电阻的NET 等...

demyar
33分钟前
3
0
完美解决H5滚动滑动穿透方案:不使用系统滚动

网上有很多黑科技解决这个问题,都不是从根本去解决,例如通过js控制弹出时html加上position:fixed; 弹窗关闭后再去掉该样式,总觉得不太对,像是打补丁。 今天终于找到了滚动穿透的原因和完...

未来cc
38分钟前
5
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部