Question

我有一个下拉菜单。我需要用数组值填充它，问题是选择不使用此值。如果我使用console.log打印该数组可以正常工作，但是当我尝试将其发送到组件时，我不知道为什么，该值不会发送。

在HTML中，如果我使用{{}}打印值不会显示任何内容。

我使用了一些 strange 代码创建此数组，我将键与文本配对，也许错误在这里。

TS（这是奇怪的代码）

 perfilesTodos: Profile[] = [];
  data: string[] = [
    "Arson",
    "Administrador de entidad",
    "Administrador de grupo",
    "Gestor",
    "Instalador"
  ];
  this.usersCtrl.getProfiles().subscribe(response => {
      response["body"].forEach((id: number) => {
        this.perfilesTodos.push({
          id,
          descripcion: this.data[id - 1]
        });
      });

    });

console.log（this.perfilesTodos）;返回

(5) [{…}, {…}, {…}, {…}, {…}]
0: {id: 1, descripcion: "Arson"}
1: {id: 2, descripcion: "Administrador de entidad"}
2: {id: 3, descripcion: "Administrador de grupo"}
3: {id: 4, descripcion: "Gestor"}
4: {id: 5, descripcion: "Instalador"}
length: 5
__proto__: Array(0)

HTML

 <div class="form-group col-md-4">
      <label for="profile">{{'profile-placeholder' | translate}}</label>
      <ng-select [items]="perfilesTodos" name="perfiles" bindLabel="descripcion" placeholder="{{'profile-placeholder' | translate}}" [(ngModel)]="perfiles">
      </ng-select>
  </div>

所以问题是：如何用该数组填充选择？

Answer 1

TL，DR

需要以下更改：

class Engine {
  std::vector<std::unique_ptr<Character>> characters;
  void do_stuff_with_spell(Spell spell) {
    // ...
  }
  void do_stuff_with_attack(Direction direction) {
    // ...
  }

 public:
  void visit(Mage& mage) { do_stuff_with_spell(mage.cast()); }
  void visit(Player& player) { do_stuff_with_attack(player.attack()); }

};

为什么我的代码无法正常工作？

根据文档：

Ng-select组件实现OnPush变化检测，这意味着脏检查检查不可变的数据类型。这意味着如果你这样做对象突变，例如：

this.usersCtrl.getProfiles().subscribe(response => {

      let tempArr = [];
      response["body"].forEach((id: number) => {
      tempArr.push({
          id,
          descripcion: this.data[id - 1]
        });
       this.perfilesTodos = [...tempArr];
      });

组件将不会检测到更改。相反，您需要这样做：

this.items.push({id: 1, name: 'New item'})

这将使组件检测到更改并更新。一些可能会担心这是一项昂贵的操作，但是，比运行ngDoCheck并不断扩散差异要好得多数组。

在这里阅读：Change detection

角度-无法将数组返回到ng-select

1 个答案: