angularjs路由传值$routeParams详解

AngularJS利用路由传值,供大家参考,具体内容如下 

1.导包

rush:xhtml;">

2.依赖注入ngRoute

rush:js;"> var myapp=angular.module("myapp",["ngRoute"]);

3.配置路由

rush:js;"> myapp.config(function ($routeProvider) { //页面选择 $routeProvider.when("/home",{ // template:"

这是主页面

" templateUrl:"home.html" }).when("/about",{ // template:"

这是关于我们的信息

" templateUrl:"about.html" }).when("/cel",{ // template:"

请联系我们

" templateUrl:"cel.html",// controller:"celCtrl" }).when("/cel/:sub",{//传参数 templateUrl:"cel.html",controller:"celCtrl" }) });

4.写cel的控制器

rush:js;"> myapp.controller("celCtrl",function ($scope,$routeParams) { //根据传过来的参数给输入框赋值 var param = $routeParams["sub"]; if(param=="a"){ $scope.mname="我想提建议..."; }else if(param=="b"){ $scope.mname="我想购买..." } });

5.通过about页面传值给cel页面

rush:xhtml;">

About页面

修改cel页面的输入框的值

rush:xhtml;">

显示页面

最后是页面布局

rush:xhtml;">

我的站点

看看效果:

内容,希望对大家的学习有所帮助,也希望大家多多支持编程之家。

相关文章

前言 做过web项目开发的人对layer弹层组件肯定不陌生,作为l...
前言 前端表单校验是过滤无效数据、假数据、有毒数据的第一步...
前言 图片上传是web项目常见的需求,我基于之前的博客的代码...
前言 导出Excel文件这个功能,通常都是在后端实现返回前端一...
前言 众所周知,js是单线程的,从上往下,从左往右依次执行,...
前言 项目开发中,我们可能会碰到这样的需求:select标签,禁...