【发布时间】：2015-10-07 20:57:49
【问题描述】：
我是 angularjs 的新手，我做了一个演示，其中有一个单选按钮列表。它们具有与它们相关的值，（数据来自 json 形式的 web 服务）现在我想获得与相关的值单击列表中的特定复选框，我也有一个演示，但仍然没有运气，任何伙伴可以帮助我吗？ js
app.controller('filterController', function ($http, $scope, $compile, $filter, $sce)
{
var page = gallery.getCurrentPage();
var Catid = page.options.params;
var Content ='';
var areacontent = '';
var cusinecontent = '';
var catcontent = '';
//headers..
var hdrcuine = '<ons-list-header>'+
'<ons-row>'+
'<ons-col>Cuisine'+'</ons-col>'+
'<ons-col width="35px" style="flex: 0 0 35px; max-width: 35px;">'+
'<ons-icon icon="ion-android-add-circle" fixed-width="true">'+'</ons-icon>'+
'</ons-col>'+
'</ons-row>'+
'</ons-list-header>';
var hdrarea = '<ons-list-header>'+
'<ons-row>'+
'<ons-col>Area'+'</ons-col>'+
'<ons-col width="35px" style="flex: 0 0 35px; max-width: 35px;">'+
'<ons-icon icon="ion-android-add-circle" fixed-width="true">'+'</ons-icon>'+
'</ons-col>'+
'</ons-row>'+
'</ons-list-header>';
var hdrcat = '<ons-list-header>Categories'+
'</ons-list-header>';
$scope.areaval = '';
// $scope.list = {
// name: '1',
// intglcode:'0'
// };
//
// $scope.rate={
// rate:'1',
// intglcode:'0'
//
// };
//
// $scope.area={
// area:'Camana bay',
// intglcode:'0'
// };
//
// $scope.cusine={
// cusine:'Pizza',
// intglcode:'0'
// };
// $scope.cat={
// cat:'Restaurant',
// intglcode:'0'
// };
//
$http({
method: 'POST',
url: API_HOST+'/webservice/Get_FilterDetails',
headers: {
'Content-Type': 'application/x-www-form-urlencoded',
'caymanauth': caymanauth
},
data: '&Catid='+Catid
}).success(function (data)
{
for(var i=0; i < data.Details.length; i++){
//PARSING DATA FOR RATYE TYPES.
if(data.Details[i] === "Rate Type"){
for(var d=0;d<5;d++)
{
$scope.list.intglcode = data.Details[i+1][d]['intGlCode'];
console.log("===========my rate types==========="+data.Details[i+1][d]['intGlCode']);
}
gRate = data.Details[i+1][d]['intGlCode'];
}
//PARSING DATA FOR LISTING TYPES.
if(data.Details[i] === "Listing Type"){
for(var d=0;d<5;d++){
console.log("===========my Listing types==========="+data.Details[i+1][d]['intGlCode']);
}
}
//PARING FOR AREA
if(data.Details[i] === "Area"){
for(var d=0;d<17;d++){
if(areacontent === ''){
var val =data.Details[i+1][d]['intGlCode'];
areacontent = '<ons-list-item modifier="tappable">'+
'<label class="checkbox checkbox--list-item">'+
'<input type="radio" ng-model="areaval" name="area" value={{val}}>'+
'<div class="checkbox__checkmark checkbox--list-item__checkmark">'+'</div>'+data.Details[i+1][d]['varCityName']+
'</label>'+
'</ons-list-item>';
}else{
areacontent += '<ons-list-item modifier="tappable">'+
'<label class="checkbox checkbox--list-item">'+
'<input type="radio" ng-model="areaval" name="area" value={{val}}>'+
'<div class="checkbox__checkmark checkbox--list-item__checkmark">'+'</div>'+data.Details[i+1][d]['varCityName']+
'</label>'+
'</ons-list-item>';
}
console.log("===========my Area types==========="+data.Details[i+1][d]['intGlCode']);
}
}
//PARSING DATA FRO CUSINE
if(data.Details[i] === "Cuisine"){
for(var d=0;d<7;d++){
if(cusinecontent === ''){
cusinecontent = '<ons-list-item modifier="tappable">'+
'<label class="checkbox checkbox--list-item">'+
'<input type="radio" ng-model="cusine.name" name="cusine" value="Asian">'+
'<div class="checkbox__checkmark checkbox--list-item__checkmark">'+'</div>'+data.Details[i+1][d]['varName']+
'</label>'+
'</ons-list-item> ';
}else{
cusinecontent += '<ons-list-item modifier="tappable">'+
'<label class="checkbox checkbox--list-item">'+
'<input type="radio" ng-model="cusine.name" name="cusine" value="Asian">'+
'<div class="checkbox__checkmark checkbox--list-item__checkmark">'+'</div>'+data.Details[i+1][d]['varName']+
'</label>'+
'</ons-list-item> ';
}
console.log("===========my cusine types==========="+data.Details[i+1][d]['intGlCode']);
}
}
//PARSING DATA FOR CATEGORIES
if(data.Details[i] === "Categories"){
for(var d=0;d<14;d++){
if(catcontent === ''){
catcontent = '<ons-list-item modifier="tappable">'+
'<label class="checkbox checkbox--list-item">'+
+" "+'<input type="radio" ng-model="cat.name" name="cat" >'+
'<div class="checkbox__checkmark checkbox--list-item__checkmark">'+'</div>'+data.Details[i+1][d]['varName']+
'</label>'+
'</ons-list-item>';
}else{
catcontent += '<ons-list-item modifier="tappable">'+
'<label class="checkbox checkbox--list-item">'+
'<input type="radio" ng-model="cat.name" name="cat" >'+
'<div class="checkbox__checkmark checkbox--list-item__checkmark">'+'</div>'+data.Details[i+1][d]['varName']+
'</label>'+
'</ons-list-item>';
}
console.log("===========my category types==========="+data.Details[i+1][d]['intGlCode']);
}
}
//return data.Details[i + 1];
}
Content = hdrarea+areacontent+hdrcuine+cusinecontent+hdrcat+ catcontent;
$scope.snippet = Content;
$scope.deliberatelyTrustDangerousSnippet = function ()
{
return $sce.trustAsHtml($scope.snippet);
};
}).error(function () {
alert("error");
});
$scope.submitForm = function () {
alert($scope.areaval);
};
【问题讨论】：
-
“我”在哪里定义？听起来很像您只是在“i”完成循环后才运行显示的代码。或者只有最后一个“data.Details”条目是美食。
-
@shilly - 实际上我真的很接近解决方案，但我的问题是我不知道如何在 javascript 中获取价值，因为我的 html 在 js 中，请查看我的编辑以了解。跨度>
-
在 html 中找不到即时错误。你确定 data.Details 包含多个元素吗？由于您最初的问题类似于：我只看到 data.Details 中的最后一个元素
-
先生，我只想知道如何在“控制器”中获取选定的单选值..
http://jsfiddle.net/8kpddb92/4/...这样我想将值传递给我的单选按钮。你能帮帮我吗? -
我不知道。您发布的示例包含一个用于创建自定义元素的指令和一个单击处理程序。我在您的代码中没有看到任何事件处理程序，因此如果您没有处理程序，请手动附加它或创建一个指令来创建您的列表项，而不是连接字符串。
标签： javascript angularjs web-services radio-button