Cách truyền dữ liệu từ component con sang component cha trong Angular
TIL
589
angular
11
DailyNote
10
White

Vani viết ngày 09/02/2018

Trong AngularJS, chúng ta có thể mapping dữ liệu 2 chiều giữa component và directive.

Đối với Angular, chúng ta không thể mapping dữ liệu 2 chiều giữa component cha và component con. Để chuyển dữ liệu từ component con trở về conponent cha, ta phải sử dụng cơ chế phát và bắt event.
Khi đó, component con phát event và component cha bắt event.

export class SuggestionMenuComponent {
    @Output() onSuggest: EventEmitter<any> = new EventEmitter();

    suggestionWasClicked(data): void {
        this.onSuggest.emit(data);
    }
}

<suggestion-menu (onSuggest)="insertSuggestion($event)">
</suggestion-menu>

Trong trường hợp muốn truyền nhiều hơn 1 dữ liệu, ta có thể làm như sau:

export class SuggestionMenuComponent {
    @Output() onSuggest: EventEmitter<any> = new EventEmitter();

    suggestionWasClicked(data1, data2): void {
        this.onSuggest.emit([data1, data2]);
    }
}

<suggestion-menu (onSuggest)="insertSuggestion($event[0],$event[1])">
</suggestion-menu>

...

vani 05-02-2018

Bình luận


White
{{ comment.user.name }}
Bỏ hay Hay
{{comment.like_count}}
Male avatar
{{ comment_error }}
Hủy
   

Hiển thị thử

Chỉnh sửa

White

Vani

12 bài viết.
2 người follow
Kipalog
{{userFollowed ? 'Following' : 'Follow'}}
Cùng một tác giả
White
2 0
Merkle tree, cũng như được biết đến là cây hash nhị phân, là một dạng cấu trúc dữ liệu sử dụng để lưu trữ hash của các thông tin cá nhân trong bộ d...
Vani viết 5 tháng trước
2 0
White
1 0
Tính bất biến của dữ liệu nằm trên blockchain có lẽ là lý do mạnh mẽ và thuyết phục nhất để triển khai các giải pháp dựa trên blockchain cho một lo...
Vani viết 5 tháng trước
1 0
Bài viết liên quan
White
0 2
fCC: Technical Documentation Page note So I have finished the HTML part of this exercise and I want to come here to lament about the lengthy HTML ...
HungHayHo viết 27 ngày trước
0 2
White
0 3
Các @Input ở component con chỉ khởi tạo giá trị ban đâu, do đó, các biến ở component cha thay đổi thì các @Input ở component con sẽ không thay đổi ...
Vani viết 5 tháng trước
0 3
{{like_count}}

kipalog

{{ comment_count }}

bình luận

{{liked ? "Đã kipalog" : "Kipalog"}}


White
{{userFollowed ? 'Following' : 'Follow'}}
12 bài viết.
2 người follow

 Đầu mục bài viết

Vẫn còn nữa! x

Kipalog vẫn còn rất nhiều bài viết hay và chủ đề thú vị chờ bạn khám phá!