微信小程序开发设计_Angular完成点击按钮后在上方

Angular实现点击按钮后在上方显示输入内容的方法       这篇文章主要介绍了Angular实现点击按钮后在上方显示输入内容的方法,涉及AngularJS事件响应及页面元素属性动态设置相关操作技巧,需要的朋友可以参考下

本文实例讲述了Angular实现点击按钮后在上方显示输入内容的方法。分享给大家供大家参考，具体如下：

先来看看运行效果：

具体代码如下：

 !DOCTYPE html 
 html lang="en" 
 head 
 meta charset="UTF-8" 
 title  Angular显示输入内容 /title 
 script src="angular.min.js" /script 
 script 
 var myapp=angular.module("myapp",[]);
 myapp.provider("User",function(){
 var user={
 name:"zs",
 sex:"girl",
 email:"zs"
 var _getUser=function(){
 return user;
 var _setUser=function(name,sex,email){
 user.name=name;
 user.sex=sex;
 user.email=email;
 this.$get=function(){
 return{
 getUser:_getUser,
 setUser:_setUser
 myapp.controller("myCtrl",function($scope,User){
 $scope.getUser=User.getUser();
 $scope.setUser=function(){
 User.setUser($scope.name,$scope.sex,$scope.email);
 /script 
 /head 
 body ng-app="myapp" ng-controller="myCtrl" 
 div 
 li {{getUser.name}} /li 
 li {{getUser.sex}} /li 
 li {{getUser.email}} /li 
 /ul 
 /div 
 div 
 name: input type="text" ng-model="name" br 
 sex: input type="text" ng-model="sex" br/ 
 email: input type="text" ng-model="email" br/ 
 button ng-click="setUser()" 按钮 /button 
 /div 
 /body 
 /html 

更多关于AngularJS相关内容感兴趣的读者可查看本站专题：《》、《》及《》

希望本文所述对大家AngularJS程序设计有所帮助。