angularjs - 异常 : Error during evaluation of "click"

Question

这是我使用 typescript 创建 angular2 的第一步，我需要帮助。第一个请求效果很好，我正在展示它。当我点击时，我想创建一个新的请求。我该怎么做？

 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));

Answer 1

您在 onSelect 方法中定义了一个构造函数，这有点奇怪:

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

我会将其重构为类似的东西:

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')
        );
    }
  }
}

我在构造函数参数级别添加了 private 以使 http 参数成为 App 类的一部分。因此，您可以将它与 this 关键字一起使用。

您会注意到现在应该使用 HTTP_PROVIDERS 而不是 HTTP_BINDINGS。

希望对你有帮助，蒂埃里