AngularJS之登录显示用户名
效果图:在这里会显示出来用户名

使用AngularJs进行这样效果
第一步:写ng-app
// 定义模块:
var app = angular.module("pinyougou",[]);
第二步定义控制器
app.controller("indexController",function($scope,loginService){
$scope.showName = function(){
loginService.showName().success(function(response){
$scope.loginName = response.username;
});
}
});
第三步定义服务层
app.service("loginService",function($http){
this.showName = function(){
return $http.get("../login/showName.do");
}
});
第四步将定义好的引入到页面中
<!-- 引入angular的js -->
<script type="text/javascript" src="../plugins/angularjs/angular.min.js"></script>
<script type="text/javascript" src="../js/base.js"></script>
<script type="text/javascript" src="../js/controller/indexController.js"></script>
<script type="text/javascript" src="../js/service/loginService.js"></script>
在body标签上引入如下
<body class="hold-transition skin-green sidebar-mini" ng-app="pinyougou" ng-controller="indexController" ng-init="showName()">
在需要进行输出的地方进行输出
<span class="hidden-xs">{{loginName}}</span>
然后使用spring安全框架的时候,可以使用下面的代码进行退出,不过需要在xml配置文件中进行配置
<a href="../logout" class="btn btn-default btn-flat">注销</a>
controller层的代码为:
package com.qingmu.core.controller; import org.springframework.security.core.context.SecurityContextHolder;
import org.springframework.security.core.userdetails.User;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController; import java.util.HashMap;
import java.util.Map; /**
* @Auther:qingmu
* @Description:脚踏实地,只为出人头地
* @Date:Created in 21:52 2019/4/12
*/
@RestController
@RequestMapping("/login")
public class LoginController {
@RequestMapping("/showName")
public Map showName() {
//使用spring安全框架中的user对象,从里面将用户名取出来,然后存入到map集合中.
User principal = (User) SecurityContextHolder.getContext().getAuthentication().getPrincipal();
Map hashMap = new HashMap();
hashMap.put("username", principal.getUsername());
return hashMap;
}
}
按照上面的步骤就可以完成一个简单的用户名显示.
AngularJS之登录显示用户名的更多相关文章
- Linux 下shell显示-bash-4.1$不显示用户名路径的解决方法
Linux CentOS下shell显示-bash-4.1$不显示用户名路径的解决方法 问题描述: CentOS下新增一个用户,登录进去之后shell脚本的信息如下: 而不是我们经常看 ...
- CentOS下shell显示-bash-4.1#不显示用户名路径的解决方法
CentOS下shell显示-bash-4.1$不显示用户名路径的解决方法 问题描述: CentOS下新增一个用户,登录进去之后shell脚本的信息如下: 而不是我们经常看到的username@hos ...
- Linux CentOS下shell显示-bash-4.1$ 不显示用户名和主机名的解决方法
CentOS下新增加一个用户,登录进去会发现shell脚本信息没有显示用户名和主机名,反而显示的是-bash-4.1$,如图所示: 而不是我们经常看到的username@hostname$的组合,看起 ...
- CentOS下shell显示-bash-4.1$不显示用户名路径
Linux CentOS下shell显示-bash-4.1$不显示用户名路径的解决方法. 问题描述: CentOS下新增一个用户,登录进去之后shell脚本的信息如下: -bash-4.1$ \ -b ...
- ORACLE数据库登录显示ORA-28001: the password has expired
Oracle数据库登录显示 "这个密码已过期,请输入新密码" 点击win键 找到Oracle的SQL Plus 点击打开之后输入登录的用户名密码,然后会显示该密码已过期,输入新口令 ...
- 在某网站的登录页面登录时如果选择“记住用户名”,登录成功后会跳转到一个中间层(页面代码将登录的用户名和密码存在cookie),中间页面中存在一个超链接,单击超链接可以链接到第三个页面查看信息。若选择“
Response实现登录并记录用户名和密码信息 在某网站的登录页面登录时如果选择"记住用户名",登录成功后会跳转到一个中间层(页面代码将登录的用户名和密码存在cookie),中间页 ...
- CAS单点登录中文用户名乱码问题
CAS单点登录中文用户名乱码问题,有两种情况 1. CAS server乱码 即在向server端提交用户名和密码时,发生了乱码,解决方法是: 打开WEB-INF/web.xml,在其它的Filter ...
- AngularJS进阶(十)AngularJS改变元素显示状态
AngularJS改变元素显示状态 前言 本文描述使用AngularJS提供的ng-show和ng-hide指令实现自动监听某布尔型变量来改变元素显示状态. 控制html元素显示和隐藏有n种方法:ht ...
- cookie保存登录的用户名和密码
用cookie保存登录的用户名和密码,当用户访问网站的时候,获取cookie的用户名和密码,通过用 用cookie保存登录的用户名和密码,当用户访问网站的时候,获取cookie的用户名和密码,通过用户 ...
随机推荐
- 异常处理的捕捉:try{}catch(异常类 变量)finally{最终执行}
可以对异常进行针对性处理的方式.try{ //需要被检查的异常 }catch(异常类 变量)//该变量用于接收发生的异常{ //处理异常的代码 }finally{ //一定会被执行的代码. }
- Day6 Python常用的模块
一.logging模块 一.日志级别 critical=50 error=40 waring=30 info=20 debug=10 notset=0 二.默认的日志级别是waring(30),默认的 ...
- POJ1611:The Suspects(模板题)
http://poj.org/problem?id=1611 Description Severe acute respiratory syndrome (SARS), an atypical pne ...
- git的reset的理解
git的reset的理解 1.在理解reset命令之前,先对git中涉及到的与该reset命令相关概念进行说明和解释HEAD这是当前分支版本顶端的别名,也就是在当前分支你最近的一个提交Indexind ...
- MySQL--5子查询与连接小结
子查询:出现在其他sql语句中的 SELECT,必须出现在小括号内,子查询外层可以是常见的SELECT语句,INSERT语句 UPDATE语句 DELETE语句,在子查询中可以包含多个关键字和条件 ( ...
- UGUI实现摇杆
效果图
- RMAN备份策略与异机恢复一例
实验环境: A机器(生产用途):RHEL 6.5 + Oracle 11.2.0.4 + IP Address 192.168.1.11 B机器(备机用途):RHEL 6.5 + Oracle 11. ...
- Struts2第三天
## Struts2第三天 ## ---------- **课程回顾:Struts2框架的第二天** 1. Servlet的API * ActionContext对象 * ServletActionC ...
- Android -- 仿小米锁屏画报
1,首先看一下我们今天实现的效果,效果图如下: 2,首先说一下大体的实现思路,首先这个视图一共分为三层,最外层是一个RecyclerView,第二层是一个被虚化的ImageView,第三层是一个正常的 ...
- RabbitMQ的使用场景
RabbitMQ的使用场景 1 大数据日志收集消息中间件应用场景 2 消息中间件在搜索系统DIH(伪实时)中的应用 伪实时的搜索系统: 后台系统:(作为生产者发送消息) ...