我有一个名为search_detail的组件,
搜索详细信息_组件.html
<li class="date">
<div class="btn-group dropdown" [class.open]="DatedropdownOpened">
<button type="button" (click)="DatedropdownOpened = !DatedropdownOpened" class="btn btn-default dropdown-toggle" data-toggle="dropdown"
aria-haspopup="true" [attr.aria-expanded]="dropdownOpened ? 'true': 'false'">
Date <span class="caret"></span>
</button>
<ul class="dropdown-menu default-dropdown">
<calendar ></calendar>
<button > Cancel </button>
<button (click)="setDate(category)"> Ok </button>
</ul>
</div>
</li>
搜寻元件详细数据.ts
import 'rxjs/add/observable/fromEvent';
@Component({
selector: 'searchDetail',
templateUrl: './search_detail.component.html',
moduleId: module.id
})
日历.组件.ts
import { Component, Input} from '@angular/core';
@Component({
moduleId:module.id,
selector: 'calendar',
templateUrl: './calendar.component.html'
})
export class CalendarComponent{
public fromDate:Date = new Date();
private toDate:Date = new Date();
private events:Array<any>;
private tomorrow:Date;
private afterTomorrow:Date;
private formats:Array<string> = ['DD-MM-YYYY', 'YYYY/MM/DD', 'DD.MM.YYYY', 'shortDate'];
private format = this.formats[0];
private dateOptions:any = {
formatYear: 'YY',
startingDay: 1
};
private opened:boolean = false;
public getDate():number {
return this.fromDate.getDate() || new Date().getTime();
}
}
我想在搜索详细信息页面中单击“确定”按钮后访问开始日期和结束日期。该如何操作?
4条答案
按热度按时间6l7fqoea1#
将子组件中得
EventEmitter
注册为@Output
:单击时发出值:
侦听父组件模板中的事件:
在父组件中:
官方文档中也有详细解释:Component interaction。
5vf7fwbs2#
若要从子组件发送数据,请在子组件中创建用output()修饰的属性,并在父组件中侦听创建的事件。需要时使用负载中的新值发出此事件。
要发出此事件:
ulydmbyx3#
大多数新版本如果出现错误,请替换此行
在这个过程中,您可以使用一个新的事件发生器()。
几乎它会解决你的错误
bjp0bcyl4#
你好,你可以使用输入和输出。输入让你传递变量从父到子。输出相同,但从子到父。
最简单的方法是传递"startdate"和"endDate"作为输入
这样你就可以直接在搜索页面中找到你的开始日期和结束日期。如果可以的话,请告诉我,或者换一种方法。谢谢