angularjs - EXCEPȚIE: Eroare în timpul evaluării "click"


Este primul meu pas în crearea Angular2 cu TypeScript și am nevoie de ajutor. Prima cerere funcționează bine și o arăt. Când fac clic, vreau să creez o cerere nouă. Cum pot face asta?

 export class App {
  img: Array<Object>;
  constructor(http:Http) {    http.request('http://boroviha.dev.ooosis.com/api/client/get_photo_sections.php').toRx().subscribe(res => {
      console.log('img',res.json().data);
      this.img = res.json().data;
    });
  }
    onSelect(item: img) { this.selectedItem = item; console.log(item);
     constructor(http:Http) {
     this.http.request('http://localhost:3001/api/random-quote')
        .map(res => res.text())
        .subscribe(
          data => this.randomQuote = data,
          err => this.logError(err),
          () => console.log('Random Quote Complete')
        );
     }
    }
}
bootstrap(App, [HTTP_BINDINGS, bind(RequestOptions).toClass(MyOptions)])
  .catch(err => console.error(err));

Răspuns #1

Definești un constructor în cadrul metodei onSelect, ceea ce este puțin ciudat:

onSelect(item: img) { this.selectedItem = item; console.log(item);
  constructor(http:Http) {
  (...)

Aș refactoriza asta în ceva de genul acesta:

export class App {
  img: Array<Object>;
  constructor(private http:Http) {    
    (...)
  }

  onSelect(item: img) {
    this.selectedItem = item; console.log(item);
    this.http.get('http://localhost:3001/api/random-quote')
        .map(res => res.text())
        .subscribe(
          data => this.randomQuote = data,
          err => this.logError(err),
          () => console.log('Random Quote Complete')
        );
    }
  }
}

Am adăugat private la nivelul parametrilor constructorului pentru a face ca parametrul http să facă parte din clasa App. Astfel, îl poți folosi cu cuvântul cheie this.

Poți observa că acum ar trebui folosit HTTP_PROVIDERS în loc de HTTP_BINDINGS.

Sper că te ajută, Thierry