Когда я использую angular 9 ngFor, массив не показывает соответствующие данные - PullRequest
0 голосов
/ 10 марта 2020

Я новичок в использовании angular. При создании проекта блога мне нужно показать все теги статьи; когда я использую ngFor, это не имеет никакого эффекта. Я надеюсь, что каждый может помочь мне увидеть, если что-то не так с тем, что я написал.

package. json

{
  "dependencies": {
    "@angular/animations": "~9.0.3",
    "@angular/common": "~9.0.3",
    "@angular/compiler": "~9.0.3",
    "@angular/core": "~9.0.3",
    "@angular/forms": "~9.0.3",
    "@angular/platform-browser": "~9.0.3",
    "@angular/platform-browser-dynamic": "~9.0.3",
    "@angular/router": "~9.0.3",
    "rxjs": "~6.5.4",
    "tslib": "^1.10.0",
    "zone.js": "~0.10.2"
  }
}

article-list.component.ts

import { Component, OnInit } from '@angular/core';
import { ConfigService } from 'src/app/@core/service/config';

@Component({
  templateUrl: './article-list.component.html',
  styleUrls: ['./article-list.component.scss']
})
export class ArticleListComponent implements OnInit {
  title = 'blog-articles';
  public tags: { text }[] = [ { text: '11'} ];

  constructor(
    private configService: ConfigService
  ) {}

  ngOnInit() {
    this.configService.getTags().subscribe(
      data => {
        this.tags = data.data;
        console.log(this.tags);
      }
    );
  }
}

article-list.component. html

    ---<br />
    <div *ngFor="let tag of tags">
        {{ tag.text }}
    </div>
    ---<br />

    {{tags[0].text}}

теги json:

0: {_id: "5e5b626acc959bf39e9e257f", text: "JavaScript", value: "JavaScript"}
1: {_id: "5e5b6284cc959bf39e9e259e", text: "Css", value: "Css"}
2: {_id: "5e5b629dcc959bf39e9e25ac", text: "Mac", value: "Mac"}
3: {_id: "5e5caed8cc959bf39e9ea0dd", text: "Redis", value: "Redis"}

1 Ответ

0 голосов
/ 10 марта 2020

Что если вы измените свой код следующим образом:

public tags: { text: string }[] = [ { text: '11'} ];

ngOnInit() {
  this.configService.getTags().subscribe(({ data }) => {
    this.tags = data;
    console.log(this.tags);
  });
}

Я сделал быстрый Stackblitz . Обратите внимание на формат tags.json.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...