解决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 相关文章推荐
静态图片的十一种滤镜效果--不支持Ie7及非IE浏览器。
Mar 06 Javascript
JavaScript实现QueryString获取GET参数的方法
Jul 02 Javascript
js展开闭合效果演示代码
Jul 24 Javascript
jquery获得keycode的示例代码
Dec 30 Javascript
jQuery中 delegate使用的问题
Jul 03 Javascript
jquery mobile开发常见问题分析
Jan 21 Javascript
js实现带农历和八字等信息的日历特效
May 16 Javascript
jQueryUI DatePicker 添加时分秒
Jun 04 Javascript
javascript入门之window对象【新手必看】
Nov 22 Javascript
BootStrap Table 后台数据绑定、特殊列处理、排序功能
May 27 Javascript
详解Vue实战指南之依赖注入(provide/inject)
Nov 13 Javascript
javascript设计模式 ? 外观模式原理与用法实例分析
Apr 15 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
php 获取全局变量的代码
2011/04/21 PHP
解析php根据ip查询所在地区(非常有用,赶集网就用到)
2013/07/01 PHP
php实现zip压缩文件解压缩代码分享(简单易懂)
2014/05/10 PHP
PHP实现的下载远程图片自定义函数分享
2015/01/28 PHP
php实现的mysqldb读写分离操作类示例
2017/02/07 PHP
javascript学习笔记(五)正则表达式
2011/04/08 Javascript
IE事件对象(The Internet Explorer Event Object)
2012/06/27 Javascript
Jquery实现弹出层分享微博插件具备动画效果
2013/04/03 Javascript
基于JQuery实现的Select级联
2014/01/27 Javascript
基于jQuery实现的文字按钮表单特效整理
2014/12/07 Javascript
JS实现分页浏览横向图片(类轮播)实例代码
2017/11/06 Javascript
JS实现table表格内针对某列内容进行即时搜索筛选功能
2018/05/11 Javascript
VUE在for循环里面根据内容值动态的加入class值的方法
2018/08/12 Javascript
js中的reduce()函数讲解
2019/01/18 Javascript
jQuery AJAX与jQuery事件的分析讲解
2019/02/18 jQuery
js中关于Blob对象的介绍与使用
2019/11/29 Javascript
Vue-cli3生成的Vue项目加载Mxgraph方法示例
2020/05/31 Javascript
Python获取系统默认字符编码的方法
2015/06/04 Python
Python 的描述符 descriptor详解
2016/02/27 Python
浅析Python的web.py框架中url的设定方法
2016/07/11 Python
Python正则表达式完全指南
2017/05/25 Python
用Python写王者荣耀刷金币脚本
2017/12/21 Python
用Python写脚本,实现完全备份和增量备份的示例
2018/04/29 Python
PyTorch搭建多项式回归模型(三)
2019/05/22 Python
用Python爬取LOL所有的英雄信息以及英雄皮肤的示例代码
2020/07/13 Python
Python爬虫之App爬虫视频下载的实现
2020/12/08 Python
PHP数据运算类型都有哪些
2013/11/05 面试题
大专毕业生简历的自我评价
2013/10/20 职场文书
管理信息系学生的自我评价
2014/01/11 职场文书
刊首寄语大全
2014/04/11 职场文书
低碳日宣传活动总结
2014/07/09 职场文书
暑假学习心得体会
2014/09/02 职场文书
优秀护士事迹材料
2014/12/25 职场文书
2016年小学生教师节广播稿
2015/12/18 职场文书
解决vue $http的get和post请求跨域问题
2021/06/07 Vue.js
Android使用EventBus发送消息,Fragment中接收消息的方法会执行多次
2022/04/24 Java/Android