Angular 8 初始化成员数组未定义

Question

Does anyone have any idea why the code below prints "undefined"?

I have defined multiple objects and I want to display the pictures in what is to come, but I have noticed that when iterating with ngfor through them nothing was display so I decided to log this the array and the result was "undefined".

export class OwnedPlacesComponent implements OnInit {
items: [
    {x: 30, y: 40, image: "https://imgur.com/U36N3uE"},
    {x: 20, y: 88, image: "https://imgur.com/U36N3uE"},
    {x: 50, y: 35, image: "https://imgur.com/U36N3uE"},
    {x: 88, y: 55, image: "https://imgur.com/U36N3uE"},
];

constructor(
    private authenticationService: AuthenticationService,
) {

}
ngOnInit() {
    console.log(this.items);
}

}

Answer 1

you are not initializing it

items= [
    {x: 30, y: 40, image: "https://imgur.com/U26N3uE"},
    {x: 20, y: 88, image: "https://imgur.com/U26N3uE"},
    {x: 50, y: 35, image: "https://imgur.com/U26N3uE"},
    {x: 88, y: 55, image: "https://imgur.com/U26N3uE"},
];

use = instead of :

Answer 2

There is a typo error, Initialise items with array of data instead of assigning the array of data as a type.

Change from

items: [
    {x: 30, y: 40, image: "https://imgur.com/U26N3uE"},
    {x: 20, y: 88, image: "https://imgur.com/U26N3uE"},
    {x: 50, y: 35, image: "https://imgur.com/U26N3uE"},
    {x: 88, y: 55, image: "https://imgur.com/U26N3uE"},
];

to

items = [
    {x: 30, y: 40, image: "https://imgur.com/U26N3uE"},
    {x: 20, y: 88, image: "https://imgur.com/U26N3uE"},
    {x: 50, y: 35, image: "https://imgur.com/U26N3uE"},
    {x: 88, y: 55, image: "https://imgur.com/U26N3uE"},
];