解决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 相关文章推荐
js String对象中常用方法小结(字符串操作)
Jan 27 Javascript
jquery动态改变onclick属性导致失效的问题解决方法
Dec 04 Javascript
jQuery控制TR显示隐藏的三种常用方法
Aug 21 Javascript
使用canvas实现仿新浪微博头像截取上传功能
Sep 02 Javascript
javascript数组克隆简单实现方法
Dec 16 Javascript
js基于setTimeout与setInterval实现多线程
Jun 17 Javascript
js改变透明度实现轮播图的算法
Aug 24 Javascript
JS得到当前时间的方法示例
Mar 24 Javascript
2种简单的js倒计时方式
Oct 20 Javascript
浅谈在react中如何实现扫码枪输入
Jul 04 Javascript
使用js实现一个简单的滚动条过程解析
Sep 10 Javascript
Vue中Object.assign清空数据报错的解决方案
Mar 03 Vue.js
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
收音机玩机评测 406 篇视频合集
2020/03/11 无线电
聊天室php&mysql(一)
2006/10/09 PHP
php提示Call-time pass-by-reference has been deprecated in的解决方法[已测]
2012/05/06 PHP
PHP设计模式之结构模式的深入解析
2013/06/13 PHP
php解析url的三个示例
2014/01/20 PHP
PHP给文字内容中的关键字进行套红处理
2016/04/12 PHP
PHP实现cookie跨域session共享的方法分析
2019/08/23 PHP
javascript知识点收藏
2007/02/22 Javascript
jquery实现带单选按钮的表格行选中时高亮显示
2013/08/01 Javascript
详解jquery uploadify 上传文件
2013/11/09 Javascript
js 剪切板应用clipboardData详细解析
2013/12/17 Javascript
jquery禁止回车触发表单提交
2014/12/12 Javascript
jQuery中height()方法用法实例
2014/12/24 Javascript
基于jquery实现百度新闻导航菜单滑动动画
2016/03/15 Javascript
jQuery+CSS3+Html5实现弹出层效果实例代码(附源码下载)
2016/05/16 Javascript
js实现悬浮窗效果(支持拖动)
2017/03/09 Javascript
详解如何用babel转换es6的class语法
2018/04/03 Javascript
JavaScript实现异步图像上传功能
2018/07/12 Javascript
[03:58]兄弟们,回来开黑了!DOTA2昔日战友招募宣传视频
2016/07/17 DOTA
Python的迭代器和生成器
2015/07/29 Python
Python实现读取文件最后n行的方法
2017/02/23 Python
Python爬虫番外篇之Cookie和Session详解
2017/12/27 Python
Python实现翻转数组功能示例
2018/01/12 Python
Python中反射和描述器总结
2018/09/23 Python
详解python中的线程与线程池
2019/05/10 Python
利用jupyter网页版本进行python函数查询方式
2020/04/14 Python
基于Python词云分析政府工作报告关键词
2020/06/02 Python
Lampegiganten丹麦:欧洲领先的照明网上商店
2018/04/25 全球购物
Android笔试题总结
2014/11/29 面试题
艺术设计专业个人求职信
2013/09/21 职场文书
商务英语广告词大全
2014/03/18 职场文书
蓝颜请假条
2014/04/11 职场文书
教师党员岗位承诺书
2014/05/29 职场文书
入股协议书范本
2014/11/01 职场文书
发票退票证明
2015/06/24 职场文书
咖啡厅里的创业计划书
2019/08/21 职场文书