如何在另一個接口中實現一個接口

我正在爲我的Angular 4應用程序組合我的服務結構，並遇到了一個問題。如何在另一個接口中實現一個接口

我想打電話給我的API GET請求將返回我User，但用戶裏面也應該返回的Applications

名單我已經創建了一個User.service.ts它看起來像：

import { Injectable } from '@angular/core'; 
import { HttpClient } from '@angular/common/http'; 
import { Observable } from 'rxjs/Observable'; 

@Injectable() 
export class UserService { 

    constructor(private _http: HttpClient) { } 

    getAllUsers(){ 
    } 

    getUserById(){ 

    } 

    createUser(){    
    }  
}

所以，當我打電話getUserById它將返回我要我創建了一個接口，用戶對象：

interface User { 
    id: string; 
    FirstName: string; 
    LastName: string; 
    Email: string; 
    Role: string; 
    Applications: //LIST OF APPLICATIONS 
}

如何獲取與我的Application.ts文件鏈接的應用程序屬性？

來源

2017-10-17 Ben Clarke

類似'應用：陣列'？ –

我不明白這個問題.... – n00dl3

@ExplosionPills所以我只需要在類的頂部導入Applications.ts文件，然後添加Array ？ –

當你說「名單，」你大概平均排列（第一類的JavaScript構造），所以你可能想使用Application類型的數組。

import { Application } from './application.interface'; 

export interface User { 
    /* ...other properties... */ 
    Applications: Array<Application>; 
}

請注意，您也可以將其寫爲Application[]，這意味着同樣的事情。隨你便。我更喜歡前者，因爲其他仿製藥沒有類似的捷徑。例如，你必須寫Observable<Application>。

現在，當分配或讀取userInstance.Applications時，數組的每個屬性被假定爲一個應用程序。

假設你Application接口是一樣的東西{ id: number, name: string }很簡單，請記住以下幾點：

// not allowed 
userInstance.Applications.push(notAnApplication); 
userInstance.Applications[0].otherProperty; 

// allowed 
userInstance.Applications[1].id; 
userInstance.Applications.push({ id, name } as Application);

還要注意的是[Application]的類型聲明不相同。這將是一個具有Application類型的單個屬性的數組。

您可以在這裏打字稿閱讀更多關於泛型：https://www.typescriptlang.org/docs/handbook/generics.html

來源

2017-10-17 15:14:09

成全它的應用程序的數組：

Applications: Application[]

來源

2017-10-17 14:46:33

在你的代碼文件的頂部

import { Application } from './Application';

使Application.ts

然後你的界面確保應用出口加

Applications: Application[];

而且

不要忘記使用export，這樣類型可他們在聲明的文件的外部訪問。
馬克在你的方法的返回類型，我省略CreateUser，因爲它是不清除它是否返回任何內容或帶入參數。

完整代碼：

import { Injectable } from '@angular/core'; 
import { HttpClient } from '@angular/common/http'; 
import { Observable } from 'rxjs/Observable'; 

import { Application } from './Application'; 

@Injectable() 
export class UserService { 

    constructor(private _http: HttpClient) { } 

    getAllUsers() : Observable<User[]> { 
    } 
    getUserById() : Observable<User> { 
    } 
} 


export interface User { 
    id: string; 
    FirstName: string; 
    LastName: string; 
    Email: string; 
    Role: string; 
    Applications: Application[]; 
}

來源

2017-10-17 14:49:18 Igor

如何在另一個接口中實現一個接口

回答

相關問題