我想从下拉QuickMessage中获取文本选项到文本区域框("在此输入消息...")。下拉列表是一个弹出框选择器,用于选择要提交给聊天的常用消息。
HTML
<div class="form-group">
<textarea class="form-control"
rows="3"
placeholder="Type message here..."></textarea>
<div class="btn-group justify-content-center"
role="group">
<div ngbDropdown
placement="top"
class="btn-group">
<button class="btn btn-primary"
id="quick-message"
ngbDropdownToggle>Quick Message</button>
<div ngbDropdownMenu
aria-labelledby="quick-message">
<button *ngFor="let quickMessage of quickMessages$ | async"
class="dropdown-item">{{quickMessage}}</button>
</div>
</div>
TS
providers: [QuickMessageService]
})
export class UserInputComponent implements OnInit {
quickMessages$: Observable<string[]>;
constructor(private quickMessageService: QuickMessageService) { }
ngOnInit() {
this.quickMessages$ = this.quickMessageService.quickMessages$;
}
}
服务
this.initFakeData();
}
get quickMessages$(): Observable<string[]>{
return this._quickMessages$.asObservable();
}
private initFakeData() {
this.quickMessages = [
`Option1`,
`Option2`,
`Option3`
];
this._quickMessages$.next(this.quickMessages);
}