我正在尝试将数据从子组件传递回父元素（角度4） . 这些数据来自“表单输入”，用户可以在其中插入一些信息 . 不幸的是，信息不会回到父元素 . 我正在寻找解决方案，有人可以帮助我吗？我的代码......
将信息从父元素发送到子组件：
<app-fix-period
[fixPeriodChoices]="model.fix_period"
[date_time_start]="model.date_time_start"
[date_time_end]="model.date_time_end"
[begin_hour]="begin_time.hour"
[begin_minute]="begin_time.minute"
[finish_hour]="end_time.hour"
[finish_minute]="end_time.minute">
</app-fix-period>
在组件...在表单上，我用用户数据填充输入，但没有任何回到父 .
<div class="form-group">
<label>Inicio</label>
<wr-calendar [(ngModel)]="date_time_start" name="date_time_start" [style]="{ width: '100%' }">
</wr-calendar>
</div>
组件......
import { Component, OnInit, Output, EventEmitter } from '@angular/core';
@Component({
selector: 'app-fix-period',
templateUrl: './fix-period.component.html',
styleUrls: ['./fix-period.component.scss'],
inputs: [
'fixPeriodChoices',
'date_time_start',
'date_time_end',
'begin_hour',
'begin_minute',
'finish_hour',
'finish_minute'
],
outputs: [
'date_time_start',
'date_time_end',
'begin_hour',
'begin_minute',
'finish_hour',
'finish_minute'
]
})
export class FixPeriodComponent implements OnInit {
constructor() { }
ngOnInit() { }
}
soo ..我会感激任何帮助
2 回答
有几种不同的方法可以将信息从孩子传递给父母 .
1）您可以使用@Output装饰器，如下所示：https://blogs.msmvps.com/deborahk/passing-data-to-and-raising-an-event-from-a-nested-component/
2）您可以使用服务来保留和传递数据，如下所示：https://blogs.msmvps.com/deborahk/build-a-simple-angular-service-to-share-data/
我们可以使用输入将数据传递给子控件，使用输出传递给父控件 .
有很多方法可以通过使用服务来共享数据，确保您没有在每个组件上使用提供程序，而只在app.module.ts中使用提供程序，否则每个组件都将创建自己的实例 .
要使用输入和输出装饰器，请参阅Angular component communication by using Input Output decorator