2,100
社区成员
发帖
与我相关
我的任务
分享菜鸟请教大神指导angular问题
菜鸟一名，求大神指导学习angular获取后台信息循环select选项不好用求指导
代码如下
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>注册</title>
<link href="css/bootstrap.css" rel="stylesheet" >
<style type="text/css">
.container{
margin-top:20px;
margin-left: 30%
}
.label{
font-size: 20px;
}
</style>
<script type="text/javascript" src="js/angular.js"></script>
<script type="text/javascript" src="js/angular.min.js"></script>
<script type="text/javascript" src="js/Xhr.js"></script>
<script type="text/javascript" src="js/jquery1.9.0.min.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
</head>
<body ng-app="myApp" ng-controller="myCtrl">
<div class="container">
<form action="AddUser.do" target="_self" method="post" >
<table width="350px" cellspacing="0" cellpadding="0">
<tr>
<td height="25px" valign="bottom">用户名：</td>
</tr>
<tr>
<td><input type="text" class="login_input login_user" id="user" name="user_name" placeholder="请输入姓名" /></td>
</tr>
<tr>
<td height="35px" valign="bottom"><lable for="password" class="col-sm-1 text-right">密 码：<lable></td>
</tr>
<tr>
<td><input type="password" class="login_input login_password" id="password" name="user_pass" placeholder="请输入密码" /></td>
</tr>
<tr>
<td height="35px" valign="bottom"><lable for="password" class="col-sm-1 text-right">找回密码问题：<lable></td>
</tr>
<tr>
<td>
<div >
<select ng-init="selectedName = sites[0]" ng-model="selectedName" ng-options="x for x in sites">
<option value="o">请选择</option>
<option ng-repeat="x in sites" value="{{x.id}}" >{{x.FindQ}}</option>
</select>
<!-- <h1>你的选择是：{{selectedSite}}</h1> -->
</div>
</td>
</tr>
<tr>
<td height="35px" valign="bottom"><lable for="password" class="col-sm-1 text-right">找回密码答案：<lable></td>
</tr>
<tr>
<td><input type="password" class="login_input login_password" id="password" name="user_pass" placeholder="请输入答案" /></td>
</tr>
</table>
</form>
</div>
</div>
<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
var url="http://localhost:8080/SSM/";
$.post(url+"FindQ.do").success(function(data){
$scope.sites = data;
alert(data);
}).error(function(){
alert("发生错误，无法获取找回问题，请联系系统管理员！");
});
});
</script>
</body>
</html>
弹框显示出：
[{"FindQ":"你的母校?","Number":1,"id":1},{"FindQ":"你的生日？","Number":2,"id":2},{"FindQ":"你母亲的姓名？","Number":3,"id":3}]
下拉框显示 每个字符都是下拉选项 “[”“{” ...
代码如下
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>注册</title>
<link href="css/bootstrap.css" rel="stylesheet" >
<style type="text/css">
.container{
margin-top:20px;
margin-left: 30%
}
.label{
font-size: 20px;
}
</style>
<script type="text/javascript" src="js/angular.js"></script>
<script type="text/javascript" src="js/angular.min.js"></script>
<script type="text/javascript" src="js/Xhr.js"></script>
<script type="text/javascript" src="js/jquery1.9.0.min.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
</head>
<body ng-app="myApp" ng-controller="myCtrl">
<div class="container">
<form action="AddUser.do" target="_self" method="post" >
<table width="350px" cellspacing="0" cellpadding="0">
<tr>
<td height="25px" valign="bottom">用户名：</td>
</tr>
<tr>
<td><input type="text" class="login_input login_user" id="user" name="user_name" placeholder="请输入姓名" /></td>
</tr>
<tr>
<td height="35px" valign="bottom"><lable for="password" class="col-sm-1 text-right">密 码：<lable></td>
</tr>
<tr>
<td><input type="password" class="login_input login_password" id="password" name="user_pass" placeholder="请输入密码" /></td>
</tr>
<tr>
<td height="35px" valign="bottom"><lable for="password" class="col-sm-1 text-right">找回密码问题：<lable></td>
</tr>
<tr>
<td>
<div >
<select ng-init="selectedName = sites[0]" ng-model="selectedName" ng-options="x for x in sites">
<option value="o">请选择</option>
<option ng-repeat="x in sites" value="{{x.id}}" >{{x.FindQ}}</option>
</select>
<!-- <h1>你的选择是：{{selectedSite}}</h1> -->
</div>
</td>
</tr>
<tr>
<td height="35px" valign="bottom"><lable for="password" class="col-sm-1 text-right">找回密码答案：<lable></td>
</tr>
<tr>
<td><input type="password" class="login_input login_password" id="password" name="user_pass" placeholder="请输入答案" /></td>
</tr>
</table>
</form>
</div>
</div>
<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
var url="http://localhost:8080/SSM/";
$.post(url+"FindQ.do").success(function(data){
$scope.sites = data;
alert(data);
}).error(function(){
alert("发生错误，无法获取找回问题，请联系系统管理员！");
});
});
</script>
</body>
</html>
弹框显示出：
[{"FindQ":"你的母校?","Number":1,"id":1},{"FindQ":"你的生日？","Number":2,"id":2},{"FindQ":"你母亲的姓名？","Number":3,"id":3}]
下拉框显示 每个字符都是下拉选项 “[”“{” ...
...全文
请发表友善的回复…
发表回复
木子0204 2017-11-03
- 打赏
- 举报
<md-select ng-model="ctrl.detail.status" placeholder="状态" required="" ng-model-options="{trackBy: '$value'}">
<md-option ng-repeat="item in StatusArray" value="{{item.value}}">{{item.name}}</md-option>
</md-select>
StatusArray 代表的是你传入下拉框集合
item.value是你的value值例如1,2,3
item.name代表的是你显示在客户端的可视化名字
木子0204 2017-11-03
- 打赏
- 举报
没有看懂你说的是什么意思来着
