通过2种方式访问​​Angular 6组件库值 [英] Access Angular 6 component library values with 2 way binding

问题描述

在Angular 6中工作
我已经成功创建了一个Angular组件库，并添加了一个具有下拉控件的组件。

Working in Angular 6 I've successfully created a Angular Component Library and added a component that has a drop down control in it.

I' ve在app.module中添加了必要的导入，并显示了我的库组件！！！

I've added the neccessary imports in app.module and got my library component to show up!!!

..使用其选择器

<my-custom-dropdown></my-custom-dropdown> 

我遇到的问题是如何获取从下拉列表中选择的值app.component？

The problem I'm having is how do I get the value that is selected from the dropDown in the app.component?

非常感谢任何帮助！

推荐答案

父组件模板：

<my-custom-dropdown (selectedValue)="handleselectedvalue($event)"></my-custom-dropdown>
<!-- Add a handleselectedvalue($event) function in your parent component. $event will contain the selected value -->

在您的孩子部分：

@Output() selectedValue = new EventEmitter</*type of selected value goes here*/>();

handleSelection(event) {
    this.selectedValue.emit(event);
}

子组件模板：

<!-- Child component template -->
<someElement (click)="handleSelection($event)"></someElement>

这篇关于通过2种方式访问​​Angular 6组件库值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！