通信：2

Question

角度は、これが私の見解の一部です：

お客様コンポーネントがサーバーから顧客データやアドレスデータを取得している

<div> 
    <div class="customer"> 
    <customer></customer> 
    </div> 
    <div class="addressAndPhases"> 
     <address></address>  
    </div> 
</div> 

。

CustomerComponent私はこのようなコンポーネントのデータからいくつかのデータを使用するアドレスコンポーネントで今

export class CustomerComponent extends SuperChildComponent { 
    public static url: string = 'orderViewCustomer'; 
    public id; 
    public allowed: boolean = false; 
    public accessLevel: AccessLevel = null; 
    public componentname: string; 
    public customerData: Customer = null; 

    constructor(private rest: REST, private authenticationService: AuthorizationService) { 
    super(); 
    this.componentname = this.constructor.name; 
    this.accessLevel = this.authenticationService.isUserLoggedIn() ? this.authenticationService.componentAccessLevel(this.constructor.name) : null; 
    console.log(this.constructor.name + ' has ' + this.accessLevel); 
    if (this.accessLevel == AccessLevel.ENABLED) { 
     this.getData(); 
    } 
    } 

    private getData(): any { 
    this.rest.get(CustomerComponent.url,this.id).subscribe(data=> this.storeData(data.json()), err => console.log(err) ,()=> this.accessLevel==AccessLevel.DISBLED); 

    } 



    private storeData(res: Object): any { 
    this.customerData =<Customer>res; 

    } 


} 
class Customer { 
    id: string = null; 
    oldId: string = ""; 
    firstName: string = ""; 
    lastName: string = ""; 
    email: string = ""; 
    addressLine1: string = ""; 
    addressLine2: string = ""; 
    addressLine3: string = ""; 
    street1: string = ""; 
    street2: string = ""; 
    postalCode: string = ""; 
    city: string = ""; 
    title: string = ""; 
    gender: string = ""; 

} 

：

<div [ngSwitch]="accessLevel"> 
    <div class="addressAndPhases" *ngSwitchCase="'ENABLED'"> 
    <h2 class="label">Address</h2><br> 
    <span>{{addressData.addressLine1}}</span><br> 
    <span>{{addressData.email}}</span> 
    </div> 
</div> 

これは私が正しい方法ではありませんどのしようとしている方法です。

AddressComponent

export class AddressComponent implements OnInit { 

public customer:CustomerComponent; 
public addressData; 
    constructor() { 
    this.addressData=this.customer.customerData; 

    } 

問題：私はコンポーネントに対処するために顧客のコンポーネントからのデータを渡すことができるかどうかはわかりませんよ。

住所コンポーネントのコンストラクタに顧客コンポーネントを挿入できますか？

入力してください。ありがとう

Answer 1

あなたは@inputと@outputデコレータを探していると思います。およびEventEmitterクラスです。 component interaction documentationの詳細については、こちらをご覧ください。

また、共有サービスでこれを行うこともできます。