如何监听 Lookup 的变化

Question

我在文档的任何地方都找不到如何检测 Lookup 组件的更改。其他不使用 ngModel 的组件也是如此，例如 Pick。甚至还有相关issue on GitHub2个多月没有回复

示例代码如下：

<ngl-lookup [(value)]="value" [lookup]="lookupAsync" field="formatted_address" [(pick)]="address">
  <template nglLookupLabel>Type an address:</template>
  <div nglLookupHeader class="slds-text-body--small">Most relevant cities</div>
  <template nglLookupItem let-ctx>
    <div class="slds-media__body">
      <div class="slds-lookup__result-text">{{ctx.formatted_address}}</div>
      <span class="slds-lookup__result-meta slds-text-body--small">Place ID: {{ctx.place_id}}</span>
    </div>
  </template>
</ngl-lookup>

相关的 plucker 可以在 "Lookups" 部分的组件页面上找到：

http://ng-lightning.github.io/ng-lightning/#/components

我错过了什么吗？看到这么多组件没有使用 ngModel，我真的很困惑。

预先感谢您的帮助。

Answer 1

[(pick)]="address"

以上语法是双向数据绑定。从某种意义上说，它将数据从 component 绑定到 input 和 input 到 component 。
这是[pick]="superhero" (pickChange)="setSuperhero($event)"

其中 setSuperhero 将更新值设置为 this.superhero。

您的问题的解决方法：

将 [(pick)]="superhero" 更改为：

[pick]="superhero" (pickChange)="superheroPicked($event)"

内部组件：

superheroPicked(superhero){
    this.superhero = superhero; 
    console.log(superhero);
}

以上将在选中时将超级英雄设置为新值，并在控制台中打印该值。

相关Plnkr：https://plnkr.co/edit/FaTlh3wzreKkaKZORjKx?p=preview

如何监听 Lookup 的变化

How to listen for a Lookup change

angular

ng-lightning