按下Enter键时，Primeng将与打字的字符串一起添加空芯片

Question

我的代码如下，这只是用于实验目的的一堆代码。 或之间没有空格输入一个

export class AppComponent {
  title = 'imoveis';
   nome:Array<pessoa>  = new Array<pessoa>();
   basic:string = "d";
  
   ngOnInit(){
     let p:pessoa = new pessoa();
     this.nome.push(p);
   }

   adicionar(event:any):void{

    let p:pessoa = new pessoa();
    p.nome = event.value;
    this.nome.push(p);
    
 
 }

}



class pessoa{
   nome:string = "diego"; 
}

我在文本之前，之后

<p-chips (onAdd)="adicionar($event)" [disabled]="false" [max]="2"  [(ngModel)]="nome">
    <ng-template let-item pTemplate="item" >
        {{  item.nome }}
    </ng-template>



  </p-chips>

值src =“ https://i.sstatic.net/0ftse.png” alt =“ erro no Layout Imagem”>

Answer 1

因为在使用Diego初始化后，您添加了carlos，nome看起来像这样。

[
    {
        "nome": "diego"
    },
    "CARLOS",
    {
        "nome": "CARLOS"
    }
]

模板尝试读取{{item.nome}}，但“ Carlos”不是具有属性nome的对象，而是一个字符串。但是Prime-NG芯片仍然可以看到应该有东西，因此它增加了无名的芯片。问题源形式onadd和ngmodel，他们都将为nome []添加一个值。 ngmodel添加字符串和onadd添加了OBJ Typeof Person。

Primeng芯片旨在容纳各种字符串，而不是物体。

nome: string[] = ['diego', 'CARLOS']

重组：

import { Component } from '@angular/core';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
})
export class AppComponent {
  nome: string[] = ['diego'];
}

<p-chips [disabled]="false" [max]="2" [(ngModel)]="nome">
  <ng-template let-item pTemplate="item">
    {{ item }}
  </ng-template>
</p-chips>

工作演示： https://stackblitz.com/edit/primeng-chips-demo-hsbneu?file=src%2fapp%2fapp%2fapp.component.ponent.html