我正在做一个 Angular 7材质 项目,我需要将一个值从Child component
传递到一个Parent component
,从选择下拉列表和输入框获得。我还想从父组件到子组件调用一个函数。
我尝试过的是@ViewChild(ChildComponent, {static: false}) child: ChildComponent
将值从Child传递给Parent,然后
@ViewChild(ParentComponent, {static: false}) parent: ParentComponent
从父级到子级调用一个函数,但没有成功。
我已经为此工作了一段时间,希望得到一些帮助。
下面是我的代码,我认为这可以澄清我的问题:
子组件
<input #selectedValue type="text" name="selectedValue" placeholder="InputBox">
<button mat-fab (click)="PassValue(selectedValue.value)">
Click Button
</button>
// material drop down
<mat-form-field>
<mat-select (selectionChange)="onSelectParameter($event)"
[(value)]="selectedParameter" [(ngModel)]="selectedParameter">
<mat-option value="value1">Car</mat-option>
<mat-option value="value2">Boat</mat-option>
<mat-option value="value3">Train</mat-option>
</mat-select>
</mat-form-field>
PassValue(selectedValue: string) {
// I want to pass "selectedValue" from child to parent component
// I want to call "testFunction()" from parent to child component
}
onSelectParameter(event) {
//I want to pass "this.dropDownValue" from child to parent component
if (event.value === 'value1') {
this.dropDownValue = event.value;
} else if (event.value === 'value2') {
this.dropDownValue = event.value;
} else if (event.value === 'value3') {
this.dropDownValue = event.value;
}
}
父组件
//call "testFunction()" from parent to child component
testFunction() {
//do stuff
}