详谈angularjs中路由页面强制更新的问题

有这么一个问题，在页面内路由页面跳转时，第一次跳入路由页面时是正常的，但是第二次会记住第一次时的状态，有时候并不想这样，想强制更新这个路由页面。

有一种方式就是使用 ui-sref-opts功能，我试了，结果不好使，不知道是哪里出的问题：

<a class="item" ui-sref="page1({id:1})" ui-sref-opts="{reload:true, notify: true}"> 链接1</a>

在网上查了一下，说是可以写click事件，试了一下，依然不好使，郁闷:

$state.go('page1', {id:1}, {reload: true})

然后查到了第三种方法，就是在要跳转的路由页面里的ion-view标签里添加一个属性cache-view="false"，然后就好使了：

<ion-view view-title="标题" cache-view="false">

......

</ion-view>

头两种方法为啥不可以用，第三种为啥可以用，原理还没搞清楚，先不管了，问题解决就好。这个angularjs真是用的一知半解，先这样吧。

以上这篇详谈angularjs中路由页面强制更新的问题就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持我们。

赞 (0)

相关推荐

  • AngularJS动态菜单操作指令

    前言  在我们创建一个angularJS应用的时候,菜单往往往是不可或缺的元素之一.也许在我们静态菜单的时候不会发现在指令中操作菜单收缩.折叠展开没有任何问题,因为我们在操作之前,页面元素渲染已经完成,所以在指令里面通过element查找目标元素可以成功.但是一旦我们的菜单的数据不是静态而是通过后台接口加载动态数据渲染,我们会发现本来在静态写好的指令操作,在转变为动态数据加载之后,怎么也没法查找到想要的目标元素. 遇到如此问题,开始觉得好奇葩的,当然这也是吐槽一下,还是得好好解决问题的,痛定失痛

  • angularjs中使用ng-bind-html和ng-include的实例

    下面这个例子,往div标签内添加html内容: <!doctype html> <html ng-app="myApp"> <head> <meta charset="UTF-8"> <title>demo</title> <script type="text/javascript" src="lib/angularjs/angular.min.js"

  • AngularJS封装$http.post()实例详解

      AngularJS封装$http.post()实例详解 用了不是很长的时间跟了一个移动APP项目,用的是ionic + AngularJS + cordova框架,其间遇到过挺多问题,其中一个就是对Ajax的封装问题. 其实针对封装问题一直以来就没停止过谈论,不同的项目也有不同的需求,举个典型的例子,我在做这个项目的时候因为一开始没有考虑封装问题所以被批评了,而我的一个朋友却因为封装了受到了批评--很尴尬不是么. 那么对于是否要封装这个问题,究竟该怎么界定?其实这不是一个很复杂的问题,归根到

  • AngularJS之ionic 框架下实现 Localstorage本地存储

    AngularJS之ionic 框架下实现 Localstorage本地存储

    前言: 我们前台用的是ionic+AngularJS,做的是混合模式移动应用.最近有一个需求是,我在页面A上面滑动的时候,跳入页面B,页面B需要加载页面A的数据,这样的页面传值如何实现呢?那就需要用到LocalStorage本地存储了. Ionic Ionic是目前最有潜力的一款HTML5手机应用开发框架.通过SASS构架应用程序,他提供了很多UI控件来帮助开发者开发强大的应用.加上angularjs可以让ionic应用体验度增强.代码也非常简单.angularjs可以提供数据的双向绑定,使用它

  • Angularjs 与 bower安装和使用详解

    bower安装和使用 入门级安装 直接上手 准备工作: 安装nodejs 通过nodejs 安装cnpm 详细过程 1.安装完nodejs 执行node -v 查看版本号 项目需求(建议)4.4.7 2.执行 cnpm -v (淘宝镜像) 查看版本号 3.执行全局命令:cnpm i -g bower 进行全局安装 4.在电脑本地磁盘自定义项目文件夹,通过CMD 执行 e: . cd webApp, (本例项目在e盘下的webApp目录) 5.进入项目目录 执行 bower init 初始化bow

  • 详解AngularJS ui-sref的简单使用

    此篇关于AngularJS ui-sref的简单使用,最近刚好学习,就顺便发到随笔上了 具体用法: <a ui-sref="man">男人</a> 这是一个非常简单的ui-sref的使用,当JavaScript重新生成网页时,它会查找$state中名为"man"的state,读取这个state的url,然后在a标签里生成href="url" rel="external nofollow" , 结果为:

  • 详解在Angularjs中ui-sref和$state.go如何传递参数

    详解在Angularjs中ui-sref和$state.go如何传递参数

    1 ui-sref.$state.go 的区别 ui-sref 一般使用在 <a>...</a>: <a ui-sref="message-list">消息中心</a> $state.go('someState')一般使用在 controller里面: .controller('firstCtrl', function($scope, $state) { $state.go('login'); }); 这两个本质上是一样的东西,我们看ui

  • 详谈angularjs中路由页面强制更新的问题

    有这么一个问题,在页面内路由页面跳转时,第一次跳入路由页面时是正常的,但是第二次会记住第一次时的状态,有时候并不想这样,想强制更新这个路由页面. 有一种方式就是使用 ui-sref-opts功能,我试了,结果不好使,不知道是哪里出的问题: <a class="item" ui-sref="page1({id:1})" ui-sref-opts="{reload:true, notify: true}"> 链接1</a> 在

  • Angularjs中的页面访问权限怎么设置

    在以往的项目中,前后端常见的配合方式是前端提供页面和ui加一点DuangDuangDuang的效果,后端搭建框架数据结构和数据交互(数据交互前后端有交集),不管是.net.java or php都能一对多的提供前端服务,然而在新形式下项目中运用了前端框架,开发情况就不一样了,比如我要说的这是在angular框架下完成的开发,模式是后端提供服务和api文档,页面和数据交互及逻辑处理由前端完成,前端俨然是个完全的programer了,这个过程中就会遇到之前意想不到的问题(如果没有做过后端开发),比如

  • 详解Vue 数据更新了但页面没有更新的 7 种情况汇总及延伸总结

    如果你发现你自己需要在 Vue 中做一次强制更新,99.9% 的情况,是你在某个地方做错了事. 1. Vue 无法检测实例被创建时不存在于 data 中的 property 原因:由于 Vue 会在初始化实例时对 property 执行 getter/setter 转化,所以 property 必须在 data 对象上存在才能让 Vue 将它转换为响应式的. 场景: var vm = new Vue({ data:{}, // 页面不会变化 template: '<div>{{message}

  • Vue数据更新但页面没有更新的多种情况问题及解决

    目录 数据更新但页面没有更新的多种情况 1.Vue无法检测实例被创建时不存在于data中的变量 2.vue也不能检测到data中对象的动态添加和删除 3.数组的时候 4.异步获取接口数据,DOM数据不发现变化 5.循环嵌套层级太深,视图不更新 6.路由参数变化时,页面不更新(数据不更新) 强制更新数据 this.$forceUpdate() 数据更新但页面没有更新的多种情况 1.Vue无法检测实例被创建时不存在于data中的变量 原因:由于 Vue 会在初始化实例时对 data中的数据执行 ge

  • AngularJS中重新加载当前路由页面的方法

    这个问题同样困扰我很久,网上的回答五花八门,全都不能解决:终于在网上找很久,看到某大神的解决办法,整理作此分享:使用ui-router重新加载当前页面的问题.(ui-router版本需要是0.2.14以上的) 用angular做项目,会碰到需要点击菜单刷新当前页面,加载当前页面,但是同一个路由页面点击没反应: 假设我们的路由页面 app.toMenu ; <a href="#" rel="external nofollow" rel="externa

  • vue3中addRoute路由变化但页面未更新问题解决

    目录 按着vue2的写法写vue3 发现路由变化了但页面没有更新 搜索了半天没有解决办法. 想了半天觉得是重复用同一个对象,vue为了节约性能就没有新建, 被vue3给优化了 解决办法,每次addRoute时 深复制组件对象 import time from "../views/time" function copyObj(obj) { if (typeof obj == "object") { if (Array.isArray(obj)) { let arr =

  • AngularJS中的路由使用及实现代码

    AngularJS中的路由使用及实现代码

    前  言 本章节将为大家介绍 AngularJS 路由.AngularJS 路由允许我们通过不同的 URL 访问不同的内容.通过 AngularJS 可以实现多视图的单页Web应用(single page web application,SPA). 1.1 Angular JS路由基础知识讲解 在AngularJS中使用路由: 1. 导入路由文件:angular-route.js 2. 在主模块中注入"ngRoute". angular.module("app",[

  • angularjs ui-router中路由的二级嵌套

    angularjs ui-router中路由的二级嵌套

    关于ui-router中嵌套路由中的问题 1.首先我们的页面层次为 其中Main.html是我们的主页,我们要在main.html中对路由进行统一的管理. main.html页面中有一个ui-view在这里将填充PageTab.html,同时被填充的PageTab.html中也有一个ui-view 这样就实现了嵌套路由. 最终效果: 当我们点击Page-1时出现的是Page1中的内容,同理点击Page-2. 下面是实际的代码: Main.html <!DOCTYPE html> <htm

  • AngularJS实现单一页面内设置跳转路由的方法

    本文实例讲述了AngularJS实现单一页面内设置跳转路由的方法.分享给大家供大家参考,具体如下: 单一页面内设置跳转路由 鉴于现在很多应用的应用功能以及场景都非常简单,如果还按照以前的思路,每个页面做一个html,通过路由进行跳转,不仅在时间上会有延迟,在某些特殊的浏览器(最典型的如微信内置浏览器)中,跳转过程中会出现短暂的白页. 因此,我们在开发过程中,将页面逻辑封装到同一个html中.当系统第一次加载页面时,将所有页面全部加载进去,然后通过angularJS内置的路由进行加载. 直接上代码

  • Vue路由切换页面不更新问题解决方案

    前言:vue-router的切换不同于传统的页面的切换.路由之间的切换,其实就是组件之间的切换,不是真正的页面切换.这也会导致一个问题,就是引用相同组件的时候,会导致该组件无法更新,也就是我们口中的页面无法更新的问题了. 一.问题呈现 在路由中进行切换结果 这时候会发现input标签的value值并没有随着路由的改变而改变.并没有更新 二.解决方案① 给<router-view :key="key"></router-view>增加一个不同:key值,这样vue

随机推荐