Một lần nữa về dữ liệu toàn cầu trong Angular2

Question

Nếu ứng dụng angular2 của tôi trông như thế này, và tóc vàng trên đầu sẽ nói chuyện với gừng ở giữa bên phải, liệu họ có tổ chức một bữa tiệc cho nó không?

Phát hiện sự kiện, sử dụng đầu vào đầu ra - đây là cách angular2? Dữ liệu nên truyền từ con này sang gốc khác, và sau đó từ cha mẹ sang con đến điểm? Tôi mới ở đây và thường tôi muốn có một số đối tượng toàn cầu, nơi tôi có thể giữ một số thông tin mà tất cả các thành phần cần biết. Khi dữ liệu thay đổi trong đối tượng toàn cục đó, nó sẽ thay đổi một cách kỳ diệu trong tất cả các dịch vụ và thành phần khác mà nó đã tiêm vào. Ví dụ đăng nhập người dùng/đăng xuất, hoặc nếu anh ta bấm vào nút và như vậy.

import {Injectable} from 'angular2/core'; 

@Injectable() 
export object Globals { 
    logged: false, 
    showThatDiv: true 
} 

Nhưng tôi đã đọc ở đâu đó rằng đó là Angular1, không phải theo Angular2. Đúng không? Hay tôi nhầm? Nó không giống như súp toàn cầu, chỉ là đối tượng của nhà nước toàn cầu.

Ví dụ bây giờ tôi có cấu trúc này:

|-root 
    |-google api component 
    |-google auth 
    |-youtube api 
     |-playlists 
     |-video 
    |-myComponent 
    |-sub1 
     |-sub2 
     |-sub3 
    |... 

phần mySub1 cần phải biết nếu người dùng đăng nhập và nếu như vậy hiển thị (* ngIf) một số div trong sub2. Hoặc từ cuộc gọi thành phần mySub3 checkGauth() trong dịch vụ googleAuth. Từ thành phần mySub2, thêm video vào danh sách phát trên YouTube và kết quả hiển thị được thêm vào trong sub2 hoặc từ sub3 tạo danh sách phát mới và hiển thị danh sách phát trên sub2. Rất nhiều biến thể.

Tôi mệt mỏi khi viết mã cho tất cả. Nó làm cho nó phức tạp hơn. Và đôi khi suy nghĩ về điều này:

|-root 
    |-google api component 
    |-google auth 
    |-youtube api 
    |-playlists 
    |-video 
    |-myComponent 
    |-sub1 
    |-sub2 
    |-sub3 
    |... 

Answer 1

Building Dịch vụ cho mỗi người trong số API của bạn là một cách tuyệt vời của cô lập các thành phần không bị rối tung cả lên với nhau. Trong trường hợp của bạn, bạn cần tạo một GoogleService nó có thể giữ ngữ cảnh của bạn về trạng thái hiện tại mà ứng dụng đang chạy. Các dịch vụ có thể tiêm vào các thành phần của bạn khi nào và ở đâu cần thiết.

Có nói rằng không có dòng tiền phạt nào chúng tôi có thể rút ra trong một số trường hợp. Trong những trường hợp,

1. Message passing, Vượt qua dữ liệu thông qua các thành phần của bạn, trong trường hợp của bạn, nếu bạn cha mẹ biết về Đăng ký và đứa trẻ muốn biết về đăng nhập, Vượt qua nó thông qua và các ràng buộc sẽ giữ nó được cập nhật để bạn sử dụng nó một cách đáng tin cậy trên các thành phần con của bạn.

2. Tạo người trợ giúp bao gồm tất cả các chức năng liên quan đến tính năng của bạn. Tham khảo nó bằng cách sử dụng nhập khẩu thời trang cũ và sử dụng nó trên các thành phần của bạn.

Emit sự kiện, sử dụng đầu vào một đầu ra - đây là angular2 cách?

Vâng, đó là cách tốt nhất để biết thành phần của bạn cần gì và các thành phần phát ra. Nhưng đây không phải là khó khăn, hai chiều dữ liệu ràng buộc cho phép bạn có được điều này làm việc với nỗ lực tối thiểu.

Dữ liệu sẽ chuyển từ con này sang gốc khác, sau đó từ cha mẹ sang con đến điểm?

Hãy để cho con lấy dữ liệu từ các phụ huynh thông qua đầu vào và trả về một đầu ra như callbacks, Checkout this Blog to see how it is done on a real world app.

Hy vọng nó sẽ giúp bạn bắt đầu. Chào mừng bạn đến với Angular 2, bạn sẽ thích nó ở đây!