Optionen nicht angezeigt in primeng Dropdown?

Ich versuche load-Werte im dropdown mit primeng Thema. Hier ist die Dokumentation der dropdown-primeng:

https://www.primefaces.org/primeng/#/dropdown

Will ich setzen Werte ohne Verwendung ngfor, weil im Modell von Unterlagen, die ich sehen kann möglich sein, es tun, erhalte ich einen array von diesem json-Objekt:

 {
            "$id": 1,
            "@xdata.type": "XData.Default.Grupo",
            "Id": 2,
            "Descricao": "Tributada para Comercialização",
            "EstoqueMin": 5,
            "EstoqueMax": 20,
            "Iat": "A",
            "Ippt": "T",
            "Ncm": "28220010",
            "Validade": 0,
            "PercentualLucro": 50,
            "PercentualDesconto": 5,
            "PercentualComissao": 5,
            "NrCaracterCodInterno": 7,
            "TipoProduto": 0,
            "Foto": null,
            "ItemSped": "00",
            "[email protected]": "Grupo(2)/IdGrupoTributario",
            "[email protected]": "Grupo(2)/IdUnidadeProduto",
            "[email protected]": "Grupo(2)/IdSecao",
            "[email protected]": "Grupo(2)/IdCategoria",
            "[email protected]": "Grupo(2)/IdSubCategoria",
            "[email protected]": "Grupo(2)/IdMarca"
        }

Möchte ich die Beschreibung, und caputure-id bei Wert ein.

mein code ist:

   <div class="ui-g-12 ui-md-6">
    <p-dropdown [options]="grupoList.Descricao" placeholder="Grupo" formControlName="IdGrupo" [autoWidth]="false" value="grupoList.Id"></p-dropdown>
    </div>

aber nicht zeigen, nichts

wenn ich es mache:

   <div class="ui-g-12 ui-md-6">
       <p-dropdown [options]="grupoList" placeholder="Grupo" formControlName="IdGrupo" [autoWidth]="false"></p-dropdown>
   </div>

Habe ich leer Optionen zahlen-array-Größe, aber ich kann die Beschreibung

@EDIT

dem code nicht funktioniert…

meine ts-Datei:

this.produtoAgilService.listarGrupo().subscribe(res=>{
      for(let i in res){
        this.grupoList.push(res[i])
      }
      this.grupoList.map(x =>({
        label: x.Descricao,
      value: x.Id
    }))

meiner html-Datei:

<p-dropdown [options]="grupoList" placeholder="Grupo" formControlName="IdGrupo" [autoWidth]="false">
              <ng-template let-item pTemplate="selectedItem"> 
                <b>{{item.Descricao}}</b> <!-- highlighted selected item -->
              </ng-template> 
              <ng-template let-item pTemplate="item"> 
                {{item.Descricao}}
              </ng-template>
            </p-dropdown>
  • Erhalten Sie ein array von Objekten oder ein einzelnes Objekt als Ergebnis?
  • array von Objekten
  • FormControlname oder formArrayName?
  • formcontrolname
  • Y verwenden Sie template-driven-Ansatz
InformationsquelleAutor Davi Resio | 2018-07-20



One Reply
  1. 3

    Gibt es zwei Möglichkeiten, mit dieser situation umzugehen ist, müssen Sie entweder Ihre Karte array, um ein array von Objekten mit den Mitgliedern label und Wert, oder, die Sie benötigen, um Ihre eigene benutzerdefinierte Vorlage.

    Map-Methode

    Sollte es keinen Grund zur änderung Ihrer HTML. Einfach eine Karte nach dem abrufen der Werte für die Liste.

    class MyComponent {
      grupoList = [];
    
      ngOnInit() {
        this.grupoList = this.somefunctionToGetValueArray().map(x => ({
          label: x.Descricao,
          value: x.$id
        }));
      }
    }
    

    Template-Methode

    Dieser Methode erstellen Sie ng-Vorlagen in Ihrem drop-down für den Artikel-Optionen. Mit dieser Methode sollten Sie nicht den code ändern.

    <p-dropdown [options]="grupoList" placeholder="Grupo" formControlName="IdGrupo" [autoWidth]="false">
      <ng-template let-item pTemplate="selectedItem"> 
        <b>{{item.Descricao}}</b> <!-- highlighted selected item -->
      </ng-template> 
      <ng-template let-item pTemplate="item"> 
        {{item.Descricao}}
      </ng-template>
    </p-dropdown>
    
    • mein code nicht funktioniert… ich Bearbeiten, meine Frage für meinen neuen code
    • In Ihrem aktualisierten code der map() nichts. Sie müssen Ergebnis, dass der Aufruf einer Variablen und binden, die auf [Optionen].
    • es funktioniert, ich danke Ihnen sehr

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.