宝哥软件园

angularjs路由传值$routeParams详解

编辑:宝哥软件园 来源:互联网 时间:2021-09-03

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

1.导包

脚本src=' http : angular。量滴js /脚本脚本src=' http :角度路线。js /脚本2。依赖注入ngRoute

var myapp=angular.module('myapp ',[' ngRoute ']);3.配置路由

myapp.config(函数($routeProvider) { //页面选择$routeProvider.when('/home ',{//template:'h2这是主页面/H2“Templateurls :”主页。html ' }).when('/about ',{//template:'h2这是关于我们的信息/H2 ' Templateurls : '关于。html ' }).when('/cel ',{//template:'h2请联系我们/h2' templateUrl:'cel.html ',//controller:'celCtrl' }).when('/cel/:sub ',{//传参数templateUrl:'cel.html ',控制器: ' cel ctrl ' })});4.写赛璐珞片的控制器

myapp.controller('celCtrl ',function ($scope,$routeParams) { //根据传过来的参数给输入框赋值var param=$ Routeprams[' sub '];if(param=='a'){ $scope.mname='我想提建议.';} else if(param==' b '){ $ scope。mname='我想购买.'} });5.通过关于;在…各处;大约页面传值给赛璐珞片页面

pAbout页面/p ul lia href=' # cel/a ' rel='外部无跟随'告诉我们/a/li lia外部' nofollow '询价/a/li/ul修改赛璐珞片页面的输入框的值

p显示页面/p ul liinput类型=“文本”占位符=' sub ' ng-model=' mname '/李丽丽输入类型=“文本”占位符=' Message ' ng-model=' minfo '/Li/ul最后是页面布局

body ng-app='myapp '!-页面布局-标题p我的站点/p div a href=' # home ' rel='外部无跟随'主页/a a href=' # about ' rel='外部无跟随'关于我们/a a href=' # cel ' rel='外部无跟随'联系我们/a/div/表头div-View=' class=' View '/div/body看看效果:

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持我们。

更多资讯
游戏推荐
更多+