góc 2 khai báo một mảng của các đối tượng

Question

Tôi đã biểu thức sau đây:

public mySentences:Array<string> = [ 
    {id: 1, text: 'Sentence 1'}, 
    {id: 2, text: 'Sentence 2'}, 
    {id: 3, text: 'Sentence 3'}, 
    {id: 4, text: 'Sentenc4 '}, 
]; 

mà không làm việc vì mảng của tôi không phải là loại string, nó chứa một danh sách các đối tượng. Làm thế nào tôi có thể delcare mảng của tôi để chứa một danh sách các đối tượng?

* mà không có một thành phần mới mà tuyên bố một lớp cho câu đó dường như một sự lãng phí

Answer 1

Tôi giả sử bạn đang sử dụng nguyên cảo.

Để có thêm thận trọng, bạn có thể xác định bạn type như một mảng của các đối tượng mà cần phải phù hợp với giao diện nhất định:

type MyArrayType = Array<{id: number, text: string}>; 

var arr: MyArrayType = [ 
    {id: 1, text: 'Sentence 1'}, 
    {id: 2, text: 'Sentence 2'}, 
    {id: 3, text: 'Sentence 3'}, 
    {id: 4, text: 'Sentenc4 '}, 
]; 

Hoặc cú pháp ngắn mà không xác định một kiểu tùy chỉnh:

var arr: Array<{id: number, text: string}> = [...]; 

Answer 2

public mySentences:Array<Object> = [ 
    {id: 1, text: 'Sentence 1'}, 
    {id: 2, text: 'Sentence 2'}, 
    {id: 3, text: 'Sentence 3'}, 
    {id: 4, text: 'Sentenc4 '}, 
]; 

Hay đúng hơn ...

export interface type{ 
    id:number; 
    text:string; 
} 

public mySentences:type[] = [ 
    {id: 1, text: 'Sentence 1'}, 
    {id: 2, text: 'Sentence 2'}, 
    {id: 3, text: 'Sentence 3'}, 
    {id: 4, text: 'Sentenc4 '}, 
]; 

Answer 3

Thứ nhất, tạo giao diện

Giả sử bạn đang sử dụng TypeScript & Angular CLI bạn có thể tạo một bằng cách sử dụng lệnh sau

ng g interface car

Sau đó thiết lập các loại tài sản

// car.interface.ts 
export interface car { 
    id: number; 
    eco: boolean; 
    wheels: number; 
    name: string; 
} 

Bây giờ bạn có thể nhập giao diện của bạn trong lớp mà bạn muốn.

import {car} from "app/interfaces/car.interface";

Và cập nhật các bộ sưu tập/mảng các đối tượng xe bằng cách đẩy mục lên mảng.

this.car.push({ 
    id: 12345, 
    eco: true, 
    wheels: 4, 
    name: 'Tesla Model S', 
}); 

Thông tin thêm về giao diện:

Một giao diện là yếu tố nguyên cảo, nó không phải là một phần của ECMAScript. Giao diện là một cách để xác định hợp đồng trên một hàm liên quan đến các đối số và loại của chúng. Cùng với các chức năng, một giao diện cũng có thể được sử dụng với một Class để xác định các loại tùy chỉnh. Giao diện là một kiểu trừu tượng, nó không chứa bất kỳ mã nào như một lớp. Nó chỉ xác định 'chữ ký' hoặc hình dạng của một API. Trong quá trình transpilation, một giao diện sẽ không tạo ra bất kỳ mã nào, nó chỉ được sử dụng bởi Typecript để kiểm tra kiểu trong quá trình phát triển.- https://angular-2-training-book.rangle.io/handout/features/interfaces.html

Answer 4

Một cách tiếp cận đó là đặc biệt hữu ích nếu bạn muốn lưu trữ dữ liệu đến từ một API bên ngoài hoặc một DB sẽ là:

1. Tạo một lớp đại diện cho mô hình dữ liệu của bạn

   export class Data{ 
       private id:number; 
       private text: string; 
   
       constructor(id,text) { 
        this.id = id; 
        this.text = text; 
       } 
   

2. Trong lớp thành phần của bạn, bạn tạo một mảng trống loại Data và điền mảng này bất cứ khi nào bạn nhận được phản hồi từ API hoặc bất kỳ nguồn dữ liệu nào bạn là chúng tôi ing

   export class AppComponent { 
       private search_key: string; 
       private dataList: Data[] = []; 
   
       getWikiData() { 
        this.httpService.getDataFromAPI() 
        .subscribe(data => { 
         this.parseData(data); 
        }); 
       } 
   
       parseData(jsonData: string) { 
       //considering you get your data in json arrays 
       for (let i = 0; i < jsonData[1].length; i++) { 
        const data = new WikiData(jsonData[1][i], jsonData[2][i]); 
        this.wikiData.push(data); 
       } 
       } 
   }