解决angular2 获取到的数据无法实时更新的问题


Posted in Javascript onAugust 31, 2018

今天在工作当中碰到了个问题,当我点击地图上面的城市,从后台获取数据更新列表,明明后台的数据已经返回到前端,但是数据就是不能实时更新到页面上,因为在做第一版的时候是没有这个问题的,就感觉可能是自己调用后台接口的时候顺序出了问题,结果一直钻到死胡同里面去了,后来求助老大,终于把问题解决了,现在记录一下,以加深记忆。

问题:点击下面地图上的城市,更新列表

解决angular2 获取到的数据无法实时更新的问题

getPageList(){
    //this.postMapJson 输入数据
    this.netUserAnalyzeService.getCityOrRegionOrgUserList(JSON.stringify(this.postMapJson))
    .then((res:any)=>{
      var list =res.data.list;
      
        var resList =this.netUserAnalyzeService.list(list);
        this.orgLists = resList;
        this.orgFirstId = res.data.list[0].organizationId;
        this.pageParams.totalItems = res.data.page["totalResult"];
      
      this.changeDetectorRef.markForCheck();
      this.changeDetectorRef.detectChanges();
    },error => this.errorMessage = error)
  }

上面代码中 changeDetectorRef 所调用的具体的方法。

当然在使用之前需要引入:

import {ChangeDetectorRef} from '@angular/core';
constructor(
    private changeDetectorRef:ChangeDetectorRef
  ){}

以上这篇解决angular2 获取到的数据无法实时更新的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Javascript异步编程的4种方法让你写出更出色的程序
Jan 17 Javascript
jQuery插件jQuery-JSONP开发ajax调用使用注意事项
Nov 22 Javascript
基于jquery的文字向上跑动类似跑马灯的效果
Sep 22 Javascript
浅谈javascript属性onresize
Apr 20 Javascript
浅谈JavaScript 的执行顺序
Aug 07 Javascript
学习JavaScript设计模式(多态)
Nov 25 Javascript
BootStrap的弹出框(Popover)支持鼠标移到弹出层上弹窗层不隐藏的原因及解决办法
Apr 03 Javascript
jQuery插件FusionCharts绘制的2D双面积图效果示例【附demo源码】
Apr 11 jQuery
jQuery实现滚动效果
Nov 17 jQuery
关于vue v-for循环解决img标签的src动态绑定问题
Sep 18 Javascript
vue.js高德地图实现热点图代码实例
Apr 18 Javascript
如何对react hooks进行单元测试的方法
Aug 14 Javascript
vue 项目中使用Loading组件的示例代码
Aug 31 #Javascript
解决Angular2 router.navigate刷新页面的问题
Aug 31 #Javascript
浅谈angularJS2中的界面跳转方法
Aug 31 #Javascript
详解vue使用vue-layer-mobile组件实现toast,loading效果
Aug 31 #Javascript
Angular2之二级路由详解
Aug 31 #Javascript
基于jQuery ztree实现表格风格的树状结构
Aug 31 #jQuery
详解Vue CLI3配置之filenameHashing使用和源码设计使用和源码设计
Aug 31 #Javascript
You might like
ThinkPHP中的常用查询语言汇总
2014/08/22 PHP
PHP伪造来源HTTP_REFERER的方法实例详解
2015/07/06 PHP
PHP PDOStatement::debugDumpParams讲解
2019/01/30 PHP
在 Laravel 中动态隐藏 API 字段的方法
2019/10/25 PHP
JavaScript库 开发规则
2009/01/31 Javascript
JavaScript prototype属性深入介绍
2012/11/27 Javascript
使用按钮控制以何种方式打开新窗口的属性介绍
2012/12/17 Javascript
html向js方法传递参数具体实现
2013/08/08 Javascript
jQuery切换所有复选框选中状态的方法
2015/07/02 Javascript
node.js调用C++开发的模块实例
2015/07/03 Javascript
JS 对象(Object)和字符串(String)互转方法
2016/05/20 Javascript
使用vue-router完成简单导航功能【推荐】
2018/06/28 Javascript
vue计算属性无法监听到数组内部变化的解决方案
2019/11/06 Javascript
vue使用自定义事件的表单输入组件用法详解【日期组件与货币组件】
2020/06/01 Javascript
[02:26]DOTA2英雄米拉娜基础教程
2013/11/25 DOTA
[01:29]2014DOTA2展望TI 剑指西雅图DK战队专访
2014/06/30 DOTA
Python中的匿名函数使用简介
2015/04/27 Python
python常用知识梳理(必看篇)
2017/03/23 Python
Python多进程并发与多线程并发编程实例总结
2018/02/08 Python
解决python tkinter界面卡死的问题
2019/07/17 Python
详解Django模版中加载静态文件配置方法
2019/07/21 Python
python实现抠图给证件照换背景源码
2019/08/20 Python
python 经典数字滤波实例
2019/12/16 Python
自定义Django默认的sitemap站点地图样式
2020/03/04 Python
详解win10下pytorch-gpu安装以及CUDA详细安装过程
2021/01/28 Python
css3 边框、背景、文本效果的实现代码
2018/03/21 HTML / CSS
HTML5调用手机摄像头拍照的实现思路及代码
2014/06/15 HTML / CSS
独特的礼品和创新的科技产品:The Grommet
2018/02/24 全球购物
德国前卫设计师时装在线商店:Luxury Loft
2019/11/04 全球购物
参观考察邀请函范文
2014/01/29 职场文书
就业推荐表自我鉴定
2014/03/21 职场文书
2014预防青少年违法犯罪工作总结
2014/12/10 职场文书
2015年“公民道德宣传日”活动方案
2015/05/06 职场文书
学校证明范文
2015/06/24 职场文书
国庆节主题班会
2015/08/15 职场文书
高中英语教学反思范文
2016/03/02 职场文书