详解在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-sref的源码:

...
element.bind("click", function(e) {
  var button = e.which || e.button;
  if ( !(button > 1 || e.ctrlKey || e.metaKey || e.shiftKey || element.attr('target')) ) {

   var transition = $timeout(function() {
    // HERE we call $state.go inside of ui-sref
    $state.go(ref.state, params, options);
   });

ui-sref最后调用的还是$state.go()方法

2 如何传递参数

首先,要在目标页面定义接受的参数:

传参,

ui-sref:

$state.go:

接收参数,

在目标页面的controller里注入$stateParams,然后 "$stateParams.参数名" 获取

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

时间: 2017-04-23

AngularJS中一般函数参数传递用法分析

本文实例讲述了AngularJS中一般函数参数传递用法.分享给大家供大家参考,具体如下: 1. 模型参数 直接使用变量名,不要加引号 <!doctype html> <html ng-app="passAter"> <head> <meta charset="utf-8"/> </head> <body> <div ng-controller="passCtrl">

AngularJS利用Controller完成URL跳转

具体写法举例: 1.js定义一个controller function MyCtrl($scope, $location) { $scope.jumpToUrl = function(path) { //TODO:add code here }; } 2.html里面应用controller <div ng-controller='MyCtrl'> <button ng-click="jumpToUrl('/signin')">signin</button

Angularjs为ng-click事件传递参数

在angularjs开发中,我们需要为ng-click事件传递一个参数. 在js中,可以接到参数: 演示:

AngularJS入门教程二:在路由中传递参数的方法分析

本文实例讲述了AngularJS在路由中传递参数的方法.分享给大家供大家参考,具体如下: 我们不仅可以在控制器中直接定义属性的值,比如: app.controller('listController',function($scope){ $scope.name="ROSE"; }); AngularJS还提供了传递参数的功能,目前我接触到的一种方式是从视图中传参: <!--首页html--> <li><a href="#/user/18"

AngularJS出现$http异步后台无法获取请求参数问题的解决方法

本文实例讲述了AngularJS出现$http异步后台无法获取请求参数问题的解决方法.分享给大家供大家参考,具体如下: angular在通过异步提交数据时使用了与jQuery不一样的请求头部和数据序列化方式,导致部分后台程序无法正常解析数据. 原理分析(网上的分析): 对于AJAX应用(使用XMLHttpRequests)来说,向服务器发起请求的传统方式是:获取一个XMLHttpRequest对象的引用.发起请求.读取响应.检查状态码,最后处理服务端的响应.整个过程示例如下: var xmlht

AngularJS通过$location获取及改变当前页面的URL

注意 本文中获取与修改的URL以 'http://172.16.0.88:8100/#/homePage?id=10&a=100' 这个路径为例: 一. 获取url的相关方法(不修改URL): 1.获取当前完整的url路径 var absurl = $location.absUrl(); //http://172.16.0.88:8100/#/homePage?id=10&a=100 2. 获取当前url路径(当前url#后面的内容,包括参数和哈希值): var url = $locati

AngularJS页面带参跳转及参数解析操作示例

本文实例讲述了AngularJS页面带参跳转及参数解析操作.分享给大家供大家参考,具体如下: 页面带参跳转 $scope.LoginSucessLocation = function () { var hre = 'http://ctb.qingguo.com/weixinCt/main#/upload_topic_start?uid=' + $scope.uid + '&orgcode=' + $scope.orgCode; location.href = hre; } 在url的后面,增加?

AngularJS中$http服务常用的应用及参数

前言 $http 服务:只是简单封装了浏览器原生的XMLHttpRequest对象,接收一个参数,这个参数是一个对象,包含了用来生成HTTP请求的配置内容,这个函数返回一个promise对象,具有success和error方法. $http服务的使用场景: var promise = $http({ method:"post", // 可以是get,post,put, delete,head,jsonp;常使用的是get,post url:"./data.json"

解析AngularJS中get请求URL出现的跨域问题

今天早上帮助同学看了一个AngularJS的问题,主要是请求中出现了跨域访问,请求被阻止. 下面是她给我的代码: <html lang="en" ng-app="myApp"> <head> <meta charset="UTF-8"> <title>Title</title> <!--<script src="../js/jquery-1.11.0.js"

移除AngularJS下URL中的#字符的方法

AngularJS 默认将会使用一个 # 号来对URL进行路由. 例如: http://example.com/ http://example.com/#/about http://example.com/#/contact 要获得干净的URL并将井号从URL中移除是很容易的. 完成两件事情就行了. 配置 $locationProvider 设置我们的相对连接的起点路径 $location 服务 在Angular中, $location服务会解析地址栏中的URL,并对你的应用程序作出改变,反之亦

Angularjs中$http以post请求通过消息体传递参数的实现方法

本文实例讲述了Angularjs中$http以post请求通过消息体传递参数的方法.分享给大家供大家参考,具体如下: Angularjs中,$http以post在消息体中传递参数,需要做以下修改,以确保消息体传递参数的正确性. 一.在声明应用的时候进行设置: var httpPost = function($httpProvider) { /******************************************* 说明:$http的post提交时,纠正消息体 ***********

AngularJS $http post 传递参数数据的方法

在cordova开发的时候使用到了$http的post方法,传递的参数服务端怎么都接收不到,搜索了下,发现使用AngularJS通过POST传递参数还是需要设置一些东西才可以! 1.不能直接使用params 例如: $http({ method: "POST", url: "http://192.168.2.2:8080/setId", params: { cellphoneId: "b373fed6be325f7"} }).success();

axios发送post请求springMVC接收不到参数的解决方法

axios发送post请求时,出现了参数后台接收不到的情况,分析了下请求,发现是请求头content-type不对,是application/json,正常应该是application/x-www-form-urlencoded. 解决方法有以下三种: 1.设置axios的默认请求头 //设置全局的 axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded'; var instance = a

解决PHP使用CURL发送GET请求时传递参数的问题

最近在使用curl发送get请求的时候发现传递参数一直没有生效,也没有返回值,以为是自己哪里写错了,网上找东西时也没有人专门来说get请求传递参数的内容,所以,今天在这里记录一下,希望可以帮到一些人 get请求是最简单的请求,不过要注意自己的请求是http请求还是https的请求,因为https请求时要关闭SSL验证,不然验证通不过,没有办法请求到数据: GET请求的参数 get传递参数和正常请求url传递参数的方式一样 function get_info($card){ $url ="http

深入理解Angularjs中$http.post与$.post

摘要 在angularjs发送post请求的时候,确实很困惑,在传递json数据的时候,总会遇到在服务端无法接受到参数的情况,这里有必要与$.post进行比较学习一下. 一个例子 这里模拟登录的一个场景,post用户名与密码,服务端接受账户并直接返回到客户端不做其它业务处理. 使用angularjs版本 /* AngularJS v1.2.15 (c) 2010-2014 Google, Inc. http://angularjs.org License: MIT */ 服务端 public c

AngularJS发送异步Get/Post请求方法

1.在页面中加入AngularJS并为页面绑定ng-app 和 ng-controller <body ng-app="MyApp" ng-controller="MyCtrl" > ... <script src="js/angular.min.js"></script> <script src="js/sbt.js"></script> 2.添加必要的控件并绑定相

解决angularjs中同步执行http请求的方法

如下所示: self.tableParams = new NgTableParams({}, { getData: function (params) { $http.post("rest/staff/page", $scope.req).success(function (data) { if (data != null && data != undefined) { $scope.staffs = data.data; params.total($scope.tot

Java微信公众平台开发(2) 微信服务器post消息体的接收

在上一篇的文章中我们详细讲述了如何将我们的应用服务器和微信腾讯服务器之间的对接操作,最后接入成功,不知道你有没有发现在上一篇的[controller]中我定义了一个get方法和一个post方法,但是在使用过程中我们就用了get方法,这里我们就来说说我们预留的post的方法的使用! 当我们在完成了服务器验证之后,此后用户每次向公众号发送消息.或者产生自定义菜单点击事件时,开发者填写的服务器配置URL将得到微信服务器推送过来的消息和事件,然后开发者可以依据自身业务逻辑进行响应,例如回复消息等!通过这

yii2 在控制器中验证请求参数的使用方法

写api接口时一般会在控制器中简单验证参数的正确性. 使用yii只带验证器(因为比较熟悉)实现有两种方式(效果都不佳). 针对每个请求单独写个 Model , 定义验证规则并进行验证. 缺点:写好多参数验证的 Model 类. 使用 独立验证器 中提到的 $validator->validateValue() 方法直接验证变量值.缺点:写实例化很多验证器对象. 有么有"一劳永逸"的做法,像在 Model 中通过 rules 方法定义验证规则并实现快速验证的呢?有! 使用方法(实现

Angularjs 根据一个select的值去设置另一个select的值方法

html: <div ng-controller="mySelectController"> <select ng-model="myField" ng-options="Field.label for Field in names" ng-change="mySelectControllerChange()"> <option value=''>{{'SELECT.LABEL.VXI.CU