解决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 代码压缩工具小结
Feb 27 Javascript
jQuery动态显示和隐藏datagrid中的某一列的方法
Dec 11 Javascript
javascript中日期函数new Date()的浏览器兼容性问题
Sep 05 Javascript
jQuery解决$符号命名冲突
Jun 18 Javascript
js实现可键盘控制的简单抽奖程序
Jul 13 Javascript
基于Bootstrap和jQuery构建前端分页工具实例代码
Nov 23 Javascript
jquery滚动条插件(可以自定义)
Dec 11 Javascript
神级程序员JavaScript300行代码搞定汉字转拼音
May 20 Javascript
利用JS如何计算字符串所占字节数示例代码
Sep 13 Javascript
基于vue2.x的电商图片放大镜插件的使用
Jan 22 Javascript
JS实现移动端触屏拖拽功能
Jul 31 Javascript
jQuery实现鼠标拖动图片功能
Mar 04 jQuery
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
高亮度显示php源代码
2006/10/09 PHP
php中substr()函数参数说明及用法实例
2014/11/15 PHP
浅谈本地WAMP环境的搭建
2015/05/13 PHP
YII Framework框架教程之国际化实现方法
2016/03/14 PHP
tp5框架使用cookie加密算法实现登录功能示例
2020/02/10 PHP
jQuery Mobile页面跳转后未加载外部JS原因分析及解决
2013/03/18 Javascript
学习JavaScript设计模式(接口)
2015/11/26 Javascript
javascript实现动态显示颜色块的报表效果
2017/04/10 Javascript
深入理解Angular4订阅(Subscribe)与取消
2017/11/22 Javascript
深入理解js 中async 函数的含义和用法
2018/05/13 Javascript
解决vue 项目引入字体图标报错、不显示等问题
2018/09/01 Javascript
jQuery-ui插件sortable实现自由拖动排序
2018/12/01 jQuery
2019最新21个MySQL高频面试题介绍
2020/02/06 Javascript
JavaScript使用prototype属性实现继承操作示例
2020/05/22 Javascript
浅谈Vuex的this.$store.commit和在Vue项目中引用公共方法
2020/07/24 Javascript
vue实现树状表格效果
2020/12/29 Vue.js
[31:29]完美世界DOTA2联赛PWL S3 INK ICE vs Magma 第一场 12.20
2020/12/23 DOTA
python将字符串转换成数组的方法
2015/04/29 Python
基python实现多线程网页爬虫
2015/09/06 Python
Python中二维列表如何获取子区域元素的组成
2017/01/19 Python
Python元字符的用法实例解析
2018/01/17 Python
python:print格式化输出到文件的实例
2018/05/14 Python
解决pycharm安装后代码区不能编辑的问题
2018/10/28 Python
python3.6数独问题的解决
2019/01/21 Python
Django错误:TypeError at / 'bool' object is not callable解决
2019/08/16 Python
python交互模式基础知识点学习
2020/06/18 Python
Python把图片转化为pdf代码实例
2020/07/28 Python
python 使用xlsxwriter循环向excel中插入数据和图片的操作
2021/01/01 Python
用canvas实现图片滤镜效果附演示
2013/11/05 HTML / CSS
Lou & Grey美国官网:主打舒适性面料服饰
2017/12/21 全球购物
思想品德课教学反思
2014/02/10 职场文书
学生打架检讨书
2014/02/14 职场文书
创意婚礼策划方案
2014/05/18 职场文书
cf战队收人口号
2014/06/21 职场文书
2014年公务员工作总结
2014/11/18 职场文书
MySQL的安装与配置详细教程
2021/06/26 MySQL