angularjs从selectedRoomList

时间:2017-05-03 15:26:43

标签: javascript angularjs json

我是angularjs的新手。我想从selectedRoomList创建文本。我有json数据。我使用嵌套的ng-repeat来在微调器中显示数据。如果我更改了值,我必须以文本形式显示selectedRoomList,如果我选择单个房间中的两个房间和双房间中的一个房间,则需要显示2SGL,1DBL对我来说有点棘手,请一些帮我解决这个问题。

"roomTypes" : [{
        "type" : "Deluxe",
        "Deluxe" : [{
                "id" : "",
                "name": "Deluxe",
                "roomCategory" : "Single",
                "maxOccupancy" : 2,
                "childAllowed" : true,      
                "number" : 0
        },
        {
                "id" : "",
                "name": "Deluxe",
                "roomCategory" : "Double",
                "maxOccupancy" : 3,
                "childAllowed" : true,
                "number" : 0        

        },
        {
                "id" : "",
                "name": "Deluxe",
                "roomCategory" : "Triple",
                "maxOccupancy" : 3,
                "childAllowed" : true,
                "number" : 0        

        },
        {
                "id" : "",
                "name": "Deluxe",
                "roomCategory" : "Twin",
                "maxOccupancy" : 3,
                "childAllowed" : true,
                "number" : 0        

        }]
},
{
        "type" : "Superior",
        "Superior" : [{
                "id" : "",
                "name": "Superior",
                "roomCategory" : "Single",
                "maxOccupancy" : 2,
                "childAllowed" : true,
                "number" : 0        

        },
        {
                "id" : "",
                "name": "Superior",
                "roomCategory" : "Double",
                "maxOccupancy" : 3,
                "childAllowed" : true,
                "number" : 0        

        },
        {
                "id" : "",
                "name": "Superior",
                "roomCategory" : "Triple",
                "maxOccupancy" : 3,
                "childAllowed" : true,
                "number" : 0        

        },
        {
                "id" : "",
                "name": "Superior",
                "roomCategory" : "Twin",
                "maxOccupancy" : 3,
                "childAllowed" : true,
                "number" : 0        

        }]
}] 

我在下面的html代码中有重复次数,它会显示不同的房间类型,如:

header :Deluxe: 
label : Single  spinner : value :number 

<div ng-repeat="room in roomTypes">
    <h5 style="color:#ff7043;">{{::$eval('messages.webapp.itinerary.hotel.roomType.'+room.type.toUpperCase())}}</h5>
        <div class="form-group col-md-3 col-xs-4" ng-repeat="roomCat in room[room.type]">
            <label class="col-md-12 col-xs-12">{{::$eval('messages.webapp.itinerary.hotel.changeRoom.'+roomCat.roomCategory.toUpperCase())}}</label>
            <div touch-spin ng-model="roomCat.number"></div>
        </div>
</div>

我编写逻辑来制作像2SGL,1DBL这样的文本 下面是我的功能,

$scope.getMultipleRoomList = function(multiple){
    var multipleRoom=multiple;
    var numSignle;
    var room='';
    console.log('Hello Welcome To',numSignle);
    multipleRoom.forEach(function(item,idx){
        var roomType=item;
        roomType[item.type].forEach(function(item1,idx1){

            if(item1.number!=0){
                console.log(numSingle);
                if(item1.roomCategory.toUpperCase()=='SINGLE'){
                    room=room+item1.number+'SGL,';
                }
                else if(item1.roomCategory.toUpperCase()=='DOUBLE'){
                    room=room+item1.number+'DBL,';
                }
                else if(item1.roomCategory.toUpperCase()=='TRIPLE'){
                    room=room+item1.number+'TRPL,';
                }
                else if(item1.roomCategory.toUpperCase()=='TWIN'){
                    room=room+item1.number+'TWN,';
                }
            }
        });

    });
    room = room.replace(/(^,)|(,$)/g, "");
    return room;
}; 

只要在微调器中更改了引用,就调用上面的函数, 如果在forEach中使用该变量,那么var numSingle将抛出错误。

1 个答案:

答案 0 :(得分:0)

我不确定我到底知道你想要什么,但是这样的事情应该有效:

var categoryLabels = {
  single: 'SGL',
  double: 'DBL',
  triple: 'TRPL',
  twin: 'TWN'
}

$scope.getMultipleRoomList = function (roomTypes) {
  var roomLabels = [];
  roomTypes.forEach(function (roomType) {
    roomType[roomType.type].forEach(function (item) {
      if (item.number > 0) {
        roomLabels.push(item.number + categoryLabels[item.roomCategory.toLowerCase()])
      }
    });
  });
  return roomLabels.join(', ');
};

numSingle可能会因为拼写错误numSignle

而引发错误