Angular 2：将属性指令的值传递为组件变量

发布时间：2020-12-17 17:54:47 所属栏目：安全来源：网络整理

导读：所以我在这里有一个属性指令appGetCurrency： md-select appGetCurrency [(ngModel)]="value" placeholder="Currency" name="currency" md-option *ngFor="let c of currencyList" [value]="c.code"{{c.dsc}}/md-option/md-select 我希望appGetCurrency指令

所以我在这里有一个属性指令appGetCurrency：

<md-select appGetCurrency [(ngModel)]="value" placeholder="Currency" name="currency">
  <md-option *ngFor="let c of currencyList" [value]="c.code">{{c.dsc}}</md-option>
</md-select>

我希望appGetCurrency指令将一些值传递给currencyList以构建选项列表.

编辑

appGetCurrency指令只是获取服务中的货币列表,然后我想将该列表传递给主机模板中的currencyList变量：

@Directive({ selector: '[appGetCurrency]' })

export class CurrencyDirective {
  currencies;

  constructor() {
    // build the <md-options> based on 'currencies' 
    this.currencies = this.service.getCurrencies('asia'); 
  }

}

解决方法

您可以像在组件中一样使用EventEmitter

@Directive({ selector: '[appGetCurrency]' })

export class CurrencyDirective {
  @Output() onCurrencyEvent = new EventEmitter();
  currencies;

  constructor() {
    // build the <md-options> based on 'currencies' 
    this.currencies = this.service.getCurrencies('asia').subscribe((res)=>{
        this.onCurrencyEvent.emit(res);
    }); 
  }

}

HTML：

<md-select appGetCurrency [(ngModel)]="value" placeholder="Currency" name="currency" (onCurrencyEvent)="currencyEventOnParent($event)">

父组件：

currencyEventOnParent(event){
  console.log(event);
}

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!