网络编程 
首页 > 网络编程 > 浏览文章

Angular中$state.go页面跳转并传递参数的方法

(编辑:jimmy 日期: 2024/11/16 浏览:3 次 )

遇到一个页面跳转的时候,在跳转后的页面获取跳转前页面的数据,我想到用一种是localstorage,一种用broadcast和on,然后老大说不用这么麻烦,既然都$state.go了直接带参数,这次就介绍一下$state.go页面跳转传递参数。

1.路由页面(注意这里要在路由上添加一个参数用于传递数据,不然在页面跳转的时候会filter)

 .state("home.workpiece",{ // 跳转前的页面
   url:"/workpiece",
   views: {
    home: {
     templateUrl: prefix + "project/workpiece.html",
     controller: "workpieceCtrl"
    }
   }
  })
  .state("home.workpieceDetail",{  //跳转后的页面
   url:"/workpieceDetail",
   views: {
    home: {
     templateUrl: prefix + "project/workpiece_detail.html",
     controller: "workpieceDetailCtrl"
    }
   }
  })

    也可以将参数放在params中  

 .state("home.workpieceDetail",{
   url:"/workpieceDetail",
   views: {
    home: {
     templateUrl: prefix + "project/workpiece_detail.html",
     controller: "workpieceDetailCtrl"
    }
   },
   params: {workpieceList:null}
  })

2.在workpieceCtrl中 

3.workpieceDetailCtrl中

这样就可以将在页面跳转的时候传递数据了。希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对网站的支持!

上一篇:js使用i18n实现页面国际化的方法
下一篇:Vue 2.0中生命周期与钩子函数的一些理解
一句话新闻
微软与英特尔等合作伙伴联合定义“AI PC”:键盘需配有Copilot物理按键
几个月来,英特尔、微软、AMD和其它厂商都在共同推动“AI PC”的想法,朝着更多的AI功能迈进。在近日,英特尔在台北举行的开发者活动中,也宣布了关于AI PC加速计划、新的PC开发者计划和独立硬件供应商计划。
在此次发布会上,英特尔还发布了全新的全新的酷睿Ultra Meteor Lake NUC开发套件,以及联合微软等合作伙伴联合定义“AI PC”的定义标准。
友情链接:杰晶网络 DDR爱好者之家 南强小屋 黑松山资源网 白云城资源网 网站地图 SiteMap