数据请求 get

新建一个服务

 1. ng g service services /+服务名

 egng g service services/player

  • 在此服务中进行设置
  1. 引入自带组件以及注册   

    import {HttpClient,HttpHeaders} from '@angular/common/http'
  2. 在export class PlayerService中写入 
    httpOptions = {headers: new HttpHeaders({'content-Type':"application/json"})}
  3. 在constructor中进行声明
     constructor(private http:HttpClient) { }

  使用传来的url值以及其他的数据(后台给定的值)

  eg:

  1. 在服务中  
  • playerListUrl:string="http://192.168.1.87:8081/api/game/games";
  • getPlayerList():Observable<any>{
        return this.http.get(this.playerListUrl,this.httpOptions);
      }
  • 在对应组件的ts文件夹中
  • 在文件中引入服务
    import { PlayerService} from '../../player.service';  路径根据自己情况进行修改
     constructor(private playerService: PlayerService) {}
  • private games:Array<any> = []
  •  this.playerService.getPlayerList().subscribe(
          resp => {
            this.games = resp.data.games
          },
          error => {
            console.log(error)
          }
        )

注释:private games:Array<any> = []  声明一个变量用来接收数据,resp.data.games就是后台传来的数据

  

在页面中

angular get 数据请求的更多相关文章

  1. angualr post 数据请求

    数据请求 post 新建一个服务 1. ng g service services /+服务名  eg:ng g service services/player 在此服务中进行设置 引入自带组件以及注 ...

  2. Ajax --- 数据请求

    下面主要介绍(JS原生)数据请求的主要步骤: Ajax 数据请求步骤: 1.创建XMLHttpRequest对象 2.准备数据发送 3.执行发送 4.指定回掉函数 第一步:创建XMLHttpReque ...

  3. 携带cookie进行数据请求

    前端进行数据请求有:普通的ajax(json)请求,jsop跨域请求,cors跨域请求,fetch请求...PC端这些请求方式中,普通的ajax(json)请求和jsop跨域请求是默认携带cookie ...

  4. XML 数据请求与JSON 数据请求

    (1)XML 数据请求 使用 AFNetworking 中的 AFHTTPRequestOperation 和 AFXMLParserResponseSerializer,另外结合第三方框架 XMLD ...

  5. 使用 AFNetworking 进行 XML 和 JSON 数据请求

    (1)XML 数据请求 使用 AFNetworking 中的 AFHTTPRequestOperation 和 AFXMLParserResponseSerializer,另外结合第三方框架 XMLD ...

  6. iOS - NetRequest 网络数据请求

    1.网络请求 1.1 网络通讯三要素 1.IP 地址(主机名): 网络中设备的唯一标示.不易记忆,可以用主机名(域名). 1) IP V4: 0~255.0~255.0~255.0~255 ,共有 2 ...

  7. iOS开发——网络Swift篇&NSURL进行数据请求(POST与GET)

    NSURL进行数据请求(POST与GET)   使用Swift进行iOS开发时,不可避免的要进行远程的数据获取和提交. 其数据请求的方式既可能是POST也可能是GET.同不管是POST还是GET又可以 ...

  8. angular的post请求,SpringMVC后台接收不到参数值的解决方案

    这是我后台SpringMVC控制器接收isform参数的方法,只是简单的打出它的值: @RequestMapping(method = RequestMethod.POST) @ResponseBod ...

  9. 解决angular的post请求后SpringMVC后台接收不到参数值问题的方法

    这是我后台SpringMVC控制器接收isform参数的方法,只是简单的打出它的值: @RequestMapping(method = RequestMethod.POST) @ResponseBod ...

随机推荐

  1. Lucene PriorityQueue & JDK PriorityQueue

    麻蛋,原来是最小堆呀!  数据结构不熟害死人呀! 看来待复习复习数据结构了 在lucene源码中对多个段合并的时候,会先将多个段放到一个PriorityQueue中,不要被这个名字迷惑,这个Prior ...

  2. laravel框架之状态更改

    //表单@if($v['sex']==0) <td class="se" ss="{{$v['sex']}}" id="{{$v['id']}} ...

  3. javascript获取url中的参数值

    javascript的实现代码如下: function QueryString(fieldName) { var urlString = document.location.search; if(ur ...

  4. MySQL Execution Plan--使用Query Rewrite

    安装Query Rewrite Plugin 在MySQL的安装目录的share文件夹下,有两个文件用来安装和卸载Query Rewrite Plugin: install_rewriter.sql: ...

  5. Java使用枚举来消除if else(转载)

    Java代码里经常出现多个if else会大大降低效率,我们可以使用枚举的方式来代替if else,示例代码如下: public enum Grade { A_10_90(90, 100, " ...

  6. 数据库系统概论(新技术篇)--中国人民大学【第13讲】KEY-VALUE数据库(键值对数据库)

    市面上主流的分布式文件系统(FS): (Hadoop的)HDFS,(Google的)GFS     详见ppt   1.数据服务与键值对数据库: 数据服务:data serving数据服务:数据的简单 ...

  7. Linux下安装Nexus-3.15私服

    1.切换到root用户 创建nexus用户:useradd nexus 设置nexus用户密码:passwd nexus 2.创建文件夹并进入该目录 linux中,软件包一般放在opt目录下,安装时, ...

  8. 201871010107-公海瑜《面向对象程序设计(java)》第二周学习总结

    201871010107-公海瑜<面向对象程序设计(java)>第二周学习总结             项目                          内容   这个作业属于哪个课 ...

  9. excel隔行选中内容如何操作

    查看log日志是站长经常要做的事,从日志中可以发现很多问题,spider最近有没来爬,爬了哪些url,哪些页面不存在了等等,这些都可以看得到.然后你要根据不同的情况采取相应的措施.ytkah喜欢把这些 ...

  10. 移动端touch与click区别--移动端开发整理笔记(五)

    移动端用touch还是click? 在移动端开发中,click事件有300ms的延时,由来源于iphone处理双击缩放功能种下的坑.因为用手指在屏幕上快速点击两次,iOS 自带的 Safari 浏览器 ...