Question

我使用AngularJS显示来自JSON的引用ID的数据。但是JSON结构略有改变，因此引用ID无法正确显示。

以前的JSON：

{
  "tid": "2440",
  "name": "Alfredo's Pizzeria",
  "field_location_category": [
      "Food and Dining"
  ]
},
{
  "tid": "2441",
  "name": "Allegro Dining Room",
  "field_location_category": [
      "Food and Dining"
  ]
},
{
  "tid": "2443",
  "name": "Art Gallery",
  "field_location_category": [
      "Gifts & Memories"
  ]
},
{
  "tid": "2435",
  "name": "Bellini's",
  "field_location_category": [
      "Entertainment/Bars"
  ]
},
{
  "tid": "2498",
  "name": "Bullseye",
  "field_location_category": [
      "Pools, Sports & Spa"
  ]
}

当前JSON：

{
  "count": 70,
  "language": "en",
  "0": {
    "id": "2420",
    "title": "Medical Center",
    "description": "The medical staff on-board are available for consultation; hours are posted in the Princess Patter.  Please contact the Medical Center should you suffer from motion sickness and require a remedy.  Professional services as well as medications are provided at reasonable costs.  For medical emergencies, please dial 911.  Your stateroom stateroom steward can provide you with the necessary safe waste receptacle if you have a medical condition that requires the use of sharps or needles.",
    "time": "8:00am-10:00am & 4:30pm-6:30pm",
    "manager": null,
    "cover_charge": "",
  },
  "1": {
    "id": "7840",
    "title": "Conference Room - Deck 5 Portside",
    "description": "Located on Deck 5 on both portside and starboard sides, the conference rooms onboard Regal Princess can be reserved for group meetings.  Please enquire for details at the Passenger Services Desk.",
    "time": null,
    "manager": null,
    "cover_charge": null,   
  },
  "2": {
    "id": "2426",
    "title": "Conference Room - Deck 5 Starboard",
    "description": "Located on Deck 5 on both portside and starboard sides, the conference rooms onboard Regal Princess can be reserved for group meetings.  Please enquire for details at the Passenger Services Desk.",
    "time": null,
    "manager": null,
    "cover_charge": "",  
  }
}

控制器是

var detailResult = $filter('filter')($scope.locationDetail, {id:path})[0];

此处$scope.locationDetail是我的JSON数据，path是从网址获取的相应ID。

我已检查$scope.locationDetail和path，两者都正确无误。我认为问题来自上一节{id:path})[0];。 id引用无法正确显示。

Answer 1

角度滤镜不会对象文字起作用。在您当前的JSON中，您将其用作＆＃34; 0＆＃34;，＆＃34; 1＆＃34;，＆＃34; 2＆＃34;等。

使您的代码正常工作。如下所示，将数组的内部内容分开

<强> CODE

var isArrayProccessingDone = false; 
$scope.newLocationDetail = [];
for(var i=0; !isArrayProccessingDone ; i++){
    newLocationDetail.push($scope.locationDetail['"'+i+'"']);
}

现在使用新创建的范围变量进行过滤。

var detailResult = $filter('filter')($scope.newLocationDetail, {id: path})[0];

（有关详细信息，请参阅SO Question）

我不知道为什么你改变了旧的JSON结构，这通常是人们所遵循的。

<强>更新

我建议您按如下方式更改JSON结构。

<强> JSON

$scope.locationDetail = {
        "count": 70,
            "language": "en",
            "subDetail": [{
            "id": "2420",
                "title": "Medical Center",
                "description": "The medical staff on-board are available for consultation; hours are posted in the Princess Patter.  Please contact the Medical Center should you suffer from motion sickness and require a remedy.  Professional services as well as medications are provided at reasonable costs.  For medical emergencies, please dial 911.  Your stateroom stateroom steward can provide you with the necessary safe waste receptacle if you have a medical condition that requires the use of sharps or needles.",
                "time": "8:00am-10:00am & 4:30pm-6:30pm",
                "manager": null,
                "cover_charge": ""
        }, {
            "id": "7840",
                "title": "Conference Room - Deck 5 Portside",
                "description": "Located on Deck 5 on both portside and starboard sides, the conference rooms onboard Regal Princess can be reserved for group meetings.  Please enquire for details at the Passenger Services Desk.",
                "time": null,
                "manager": null,
                "cover_charge": null
        }, {
            "id": "2426",
                "title": "Conference Room - Deck 5 Starboard",
                "description": "Located on Deck 5 on both portside and starboard sides, the conference rooms onboard Regal Princess can be reserved for group meetings.  Please enquire for details at the Passenger Services Desk.",
                "time": null,
                "manager": null,
                "cover_charge": ""
        }]
    }

然后您的过滤器将如下所示。

var detailResult = $filter('filter')($scope.locationDetail.subDetail, {id:'7840'})[0];

Working Fiddle

希望这可以帮到你。感谢。

使用AngularJS从JSON显示带引用标识的数据

1 个答案: