无需重复即可检索数据

时间:2018-12-17 17:18:37

标签: angular ionic-framework

我正在尝试检索我的数据,但没有重复该值。

数据:

addNewClothes: 
0:
addLaundryServices: "4 - Wash"
add_Main_Categories: "169 - Quilt & Blanket"
add_Sections: "275 - Quilt types"
clothesID: 911
newClothes: "Medium quilt"
price: "14"

1:
addLaundryServices: "4 - Wash"
add_Main_Categories: "169 - Quilt & Blanket"
add_Sections: "275 - Quilt types"
clothesID: 910
newClothes: "Small quilt"
price: "10"

HTML:

<ion-content padding>
  <div id="sections" *ngFor="let mainCategory of clothesListArr?.addNewClothes">
    <h4>{{mainCategory.add_Main_Categories}}</h4>
  </div>
  <div id="sections" *ngFor="let section of clothesListArr?.addNewClothes">
    <h5>{{section.add_Sections}}</h5>
  </div>
  <div id="clothes" *ngFor="let clothe of clothesListArr?.addNewClothes">
    <h6>{{clothe.newClothes}}</h6>
  </div>

  <div id=servicePrice></div>
</ion-content>

它要检索两次“ add_Main_Categories”,“ add_Sections”和“ newClothes”,而我想要的是一次拥有“ add_Main_Categories”和“ add_Sections”,然后列出“ newClothes”

2 个答案:

答案 0 :(得分:0)

您可能希望像这样转换响应:

response: any;

let addNewClothes = [{
  "addLaundryServices": "4 - Wash",
  "add_Main_Categories": "169 - Quilt & Blanket",
  "add_Sections": "275 - Quilt types",
  "clothesID": 911,
  "newClothes": "Medium quilt",
  "price": "14"
}, {
  "addLaundryServices": "4 - Wash",
  "add_Main_Categories": "169 - Quilt & Blanket",
  "add_Sections": "275 - Quilt types",
  "clothesID": 910,
  "newClothes": "Small quilt",
  "price": "10"
}];

let {
  addLaundryServices,
  add_Main_Categories,
  add_Sections
} = addNewClothes[0];

this.response = {
  addLaundryServices,
  add_Main_Categories,
  add_Sections,
  clothes: addNewClothes.map(cloth => ({
    clothesID: cloth.clothesID,
    newClothes: cloth.newClothes,
    price: cloth.price
  }))
}

console.log(response);

现在在您的模板中:

<ion-content padding>
  <div id="sections">
    <h4>{{response.add_Main_Categories}}</h4>
  </div>
  <div id="sections">
    <h5>{{response.add_Sections}}</h5>
  </div>
  <div id="clothes" *ngFor="let cloth of response.clothes">
    <h6>{{clothe.newClothes}}</h6>
  </div>

  <div id=servicePrice></div>
</ion-content>

答案 1 :(得分:0)

将您的响应对象传递给以下方法,它应该可以工作

removeDuplicates(recordsArray: Array<any>) {
    var uniqueNames = [];
    recordsArray.forEach(item => {
      let recordItem = uniqueNames.find(x => {
        console.log(x.addLaundryServices);
        console.log(item.addLaundryServices);
        return (x.addLaundryServices.indexOf(item.addLaundryServices) == -1);
      });
      if (recordItem)
        uniqueNames.push(item);
      else if (uniqueNames.length == 0) {
        uniqueNames.push(item);
      }
    });

    console.log(uniqueNames);
    return uniqueNames;
  }

您的响应对象应该是一个数组作为输入。 示例-https://next.plnkr.co/edit/E2pzQuuTsgEoc09