解决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 相关文章推荐
IE8 中使用加速器(Activities)
May 14 Javascript
php和js对数据库图片进行等比缩放示例
Apr 28 Javascript
JavaScript中this关键词的使用技巧、工作原理以及注意事项
May 20 Javascript
JavaScript中的操作符==与===介绍
Dec 31 Javascript
js控制网页前进和后退的方法
Jun 08 Javascript
深入浅析JS是按值传递还是按引用传递(推荐)
Sep 18 Javascript
bootstrap弹出层的多种触发方式
May 10 Javascript
React-Native 组件之 Modal的使用详解
Aug 08 Javascript
JS轮播图实现简单代码
Feb 19 Javascript
JavaScript中防止微信浏览器被整体拖动的方法
Aug 25 Javascript
浅谈Vue2.0父子组件间事件派发机制
Jan 08 Javascript
vue 实现走马灯效果
Oct 28 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
现磨咖啡骗局!现磨咖啡=新鲜咖啡?现磨咖啡背后的猫腻你不懂!
2019/03/28 冲泡冲煮
windows下PHP APACHE MYSQ完整配置
2007/01/02 PHP
CI框架源码阅读,系统常量文件constants.php的配置
2013/02/28 PHP
php开发时容易忘记的一些技术细节
2016/02/03 PHP
PHP删除字符串中非字母数字字符方法总结
2019/01/20 PHP
jquery 得到当前页面高度和宽度的两个函数
2010/02/21 Javascript
基于jquery的获取mouse坐标插件的实现代码
2010/04/01 Javascript
javascript 数组学习资料收集
2010/04/11 Javascript
Javascript动态绑定事件的简单实现代码
2010/12/25 Javascript
js下拉框二级关联菜单效果代码具体实现
2013/08/03 Javascript
为Javascript中的String对象添加去除左右空格的方法(示例代码)
2013/11/30 Javascript
深入浅出理解javaScript原型链
2015/05/09 Javascript
浅谈jQuery hover(over, out)事件函数
2016/12/03 Javascript
Vuejs仿网易云音乐实现听歌及搜索功能
2017/03/30 Javascript
JSON 数据格式详解
2017/09/13 Javascript
AngularJS 教程及实例代码
2017/10/23 Javascript
vue一个页面实现音乐播放器的示例
2018/02/06 Javascript
详解实现一个通用的“划词高亮”在线笔记功能
2019/04/23 Javascript
微信小程序实现单列下拉菜单效果
2019/04/25 Javascript
JavaScript面向对象中接口实现方法详解
2019/07/24 Javascript
layui关闭弹窗后刷新主页面和当前更改项的例子
2019/09/06 Javascript
Bootstrap table 服务器端分页功能实现方法示例
2020/06/01 Javascript
10个易被忽视但应掌握的Python基本用法
2015/04/01 Python
python设计模式大全
2016/06/27 Python
python字符串格式化方式解析
2019/10/19 Python
Python阶乘求和的代码详解
2020/02/14 Python
Python定时从Mysql提取数据存入Redis的实现
2020/05/03 Python
2014植树节活动总结
2014/03/11 职场文书
大学生创业计划书怎么写
2014/09/15 职场文书
党员评议个人总结
2014/10/20 职场文书
2014年数学教师工作总结
2014/12/03 职场文书
关于长城的导游词
2015/01/30 职场文书
岳庙导游词
2015/02/04 职场文书
廉政承诺书2015
2015/04/28 职场文书
简历自我评价范文
2019/04/24 职场文书
python lambda 表达式形式分析
2022/04/03 Python