Cách truyền dữ liệu từ component con sang component cha trong Angular
TIL
635
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.
3 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 9 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 9 tháng trước
1 0
White
1 0
Ethereum là gì Ethereum là nền tảng để thực thi hợp đồng thông minh (smart contract) và xây dựng ứng dụng phi tập trung (Decentralize Application ...
Vani viết 10 tháng trước
1 0
Bài viết liên quan
White
0 0
Webpack Webpack là một module loader khá phổ biến trong phát triển web phía front end. Trong project xây dựng DApps trên Ethereum, ta hoàn toàn co...
Vani viết 10 tháng trước
0 0
White
0 1
Ethereum Private Network on Azure Lên Azure, tạo service: Ethereum Consortium Leader Sau khi tạo xong, sẽ có 1 leader node có khoảng 1000 tỷ ethe...
Vani viết 10 tháng trước
0 1
{{like_count}}

kipalog

{{ comment_count }}

bình luận

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


White
{{userFollowed ? 'Following' : 'Follow'}}
12 bài viết.
3 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á!