Question

我正在解决这个问题，我想知道是否有人可以帮助我。当我单击一个按钮时，我有一个从数据库接收到的产品列表，现在我创建了一个选择区域：南，北，中。 ....我需要的是：选择任何区域时，仅显示该区域的产品。它是一个初始过滤器，在点击产品按钮时可在南部区域使用，仅显示南方的产品。但是我没有实现该目标所必须做的事情。谁能给我个主意？

Home.HTML

    <ion-select interface="popover" (ionChange)="selecionaregiao()"
    [(ngModel)]="regiao" class="optselect" padding>
       <ion-option *ngFor="let regiao of regioes">{{regiao.nom_regiao}}
       </ion-option>
    </ion-select>

Home.TS

 ionViewDidLoad() {
this.db.getRegiao()
.then(data => this.regioes = data)
.catch(error => console.log('Something want wrong!'));
console.log();

this.viewCtrl.setBackButtonText('');
} 
selecionaregiao() {                                               // Select Região //
this.db.getProdutosregiao()
       .then(data => this.regioes = data)
       .catch(error => console.log('Something want wrong!'));

}

DATABASE.TS

getRegiao(){                  // Regiões // 
return new Promise<Regiao[]>((resolve, reject) => {   
  let sql = "SELECT TR.NOM_REGIAO " + 
            "FROM TB_REGIAO TR " 

  console.log(sql);  
  this.executeQuery(sql).then(data => {
    let regioes = [];
    data.forEach(function (row) {
      let regiao: Regiao = { nom_regiao: row[0]}
      regioes.push(regiao);
    });
    resolve(regioes);

  }).catch(error => {
    console.log(error);
      });

      });

      }

     getProdutosregiao(){                      
     return new Promise<Regiao[]>((resolve, reject) => {   
     let sql = "SELECT NOM_PRODUTO, DESC_PRODUTO, VAL_PRODUTO, 
     DESC_DESCONTO, 
    DESC_EXPERIENCIA, NOM_PATHIMAGEM, NOM_ENDERECO, NOM_COMPLEMENTO, 
    NOM_BAIRRO, 
    NOM_CIDADE, COD_UF, NUM_CEP, DESC_FUNCIONAMENTO, NOM_PATHIMAGEM_DESC " +
            "FROM TB_PRODUTO "


  console.log(sql);  
  this.executeQuery(sql).then(data => {
    let regioes = [];
    data.forEach(function (row) {
      let regiao: Regiao = { nom_regiao: row[0]}
      regioes.push(regiao);
    });
    resolve(regioes);

  }).catch(error => {
    console.log(error);
  });

   });

  }

img

Answer 1

首先将REGIAO_ID添加到要加载的选项中

getRegiao() {
    return new Promise<Regiao[]>((resolve, reject) => {
      let sql = "SELECT TR.NOM_REGIAO, TR.REGIAO_ID " +
        "FROM TB_REGIAO TR "
      console.log(sql);
      this.executeQuery(sql).then(data => {
        let regioes = [];
        data.forEach(function (row) {
          let regiao: Regiao = { nom_regiao: row[0], id_regiao: row[1] }
          regioes.push(regiao);
        });
        resolve(regioes);
      }).catch(error => {
        console.log(error);
      });
    });
  }

之后，在视图中添加事件以获取ID和ion-option的值：

<ion-select interface="popover" (ionChange)="selecionaregiao($event)"
    [(ngModel)]="regiao" class="optselect" padding>
       <ion-option *ngFor="let regiao of regioes" [value]="regiao.id_regiao">{{regiao.nom_regiao}}
       </ion-option>
    </ion-select>

要加载产品时，请发送您在$event

中收到的参数

selecionaregiao(id_regiao) {
    this.db.getProdutosregiao(id_regiao)
       .then(data => this.regioes = data)
       .catch(error => console.log('Something want wrong!'));
  }

最后只过滤具有该ID的信息：

getProdutosregiao(id_regiao) {
    return new Promise<Regiao[]>((resolve, reject) => {
      let sql = "SELECT NOM_PRODUTO, DESC_PRODUTO, VAL_PRODUTO, "+
        "DESC_DESCONTO, DESC_EXPERIENCIA, NOM_PATHIMAGEM, NOM_ENDERECO, NOM_COMPLEMENTO,"+
        "NOM_BAIRRO, NOM_CIDADE, COD_UF, NUM_CEP, DESC_FUNCIONAMENTO, NOM_PATHIMAGEM_DESC " +
      "FROM TB_PRODUTO WHERE REGIAO_ID="+id_regiao
      this.executeQuery(sql).then(data => {
        let regioes = [];
        data.forEach(function (row) {
          let regiao: Regiao = { nom_regiao: row[0] }
          regioes.push(regiao);
        });
        resolve(regioes);
      }).catch(error => {
        console.log(error);
      });
    });
  }

离子选择动态

1 个答案: