Загрузка элементов из массива в Angular 2

Question

Загрузка элементов из массива в Angular 2

1

Мне бы хотелось, чтобы все тестировали производительность трех интерфейсных фреймворков. AngularJS Angular 2 и EmberJS.

В настоящее время я пытаюсь загрузить 1000 объектов из массива чисел для проверки производительности. Я столкнулся с проблемами с загрузкой элементов из массива в список html при загрузке страницы.

app.component.ts:

import { Component, OnInit } from '@angular/core';

@Component({
  selector: 'my-app',
  template: '
  <input type="button" value="load items">
 <ul>
 <li  (load)="ngOnInit() "*ngFor="let number of numberArray">
 <span class="badge">{{number}}</span> 
 <li>
 </ul>'
})




export class AppComponent implements OnInit {
  ngOnInit(): void {
    var numberArray: Array<number> = [];

    for (var i = 0; i < 1000; i++) {
      numberArray.push(i);
    }
    console.log(numberArray);
  }

};

Чтобы прояснить мою проблему: я хочу загрузить объект 1000 из моего массива, когда загружаю страницу, я с нетерпением жду вашего ответа

Charles Schoofs 09 июнь 2017, в 12:12

Источник

Теги:

angular

javascript

angular2-template

2 ответа

0

просто используйте требуемый html-код внутри *ngIf следующим образом

<div *ngIf="numberArray.length > 0">
<input type="button" value="load items">
 <ul>
 <li  (load)="ngOnInit() "*ngFor="let number of numberArray">
 <span class="badge">{{number}}</span> 
 <li>
 </ul>
<div>

определить переменную numberArray как глобальную переменную

Dilanka Rathnayake 09 июнь 2017, в 08:21

Ещё вопросы

anoop · Accepted Answer · 2017-06-09T08-06-00.000Z

Вы должны привязать numberArray к классу AppComponent, чтобы он был подвергнут воздействию html.

Поэтому измените var numberArray: Array<number> = []; to numberArray: Array<number> = []; ouside ngOnInit() а затем доступ через this

Сделайте это так:

export class AppComponent implements OnInit {
numberArray: Array<number> = [];
  ngOnInit(): void {    
    for (var i = 0; i < 1000; i++) {
      this.numberArray.push(i);
    }
    console.log(numberArray);
  }    
};