2

这个特殊的Plunker是用 alpha.45 编写的。

我已经用 angular beta 编写了一个成功的plunker。

我正在尝试结合这两个代码示例。一般来说，我认为通过改变它会很简单

    <script src="https://code.angularjs.org/2.0.0-alpha.45/angular2.min.js"></script>

至

    <script src="https://code.angularjs.org/2.0.0-beta.0/angular2.min.js"></script>

可能会有一些其他的变化，但 HTTP BINDINGS 似乎存在一个严重的问题。

在我的本地我得到

错误：未定义 HTTP_BINDINGS 加载错误

angular.io 文档中的实时示例引用了 alpha.37。我似乎无法正确加载这些 Http 绑定。

经过一些详尽的谷歌搜索后，我似乎无法找到答案。

更新：

我停止使用 Plunker 并尝试关注 Eric 的评论。

这是我的 app.component.ts

import {Component} from 'angular2/core';
import {bootstrap} from 'angular2/platform/browser';
import {NgFor} from 'angular2/common';
import {HTTP_PROVIDERS, Http} from 'angular2/http';

import {PeopleService} from './peopleService'
import {Person} from './person'

@Component({
    selector: 'my-app',
    providers: [PeopleService,HTTP_PROVIDERS]

})
@View({
  template: `
    <div>
      <h2>Hello Angular2!</h2>
      <my-person 
        *ngFor="#person of people" 
        [name]="person.name"
        (hello)="saidHello($event)">
      </my-person>
    </div>
  `,
  directives: [CORE_DIRECTIVES, Person]
})
export class AppComponent {
  constructor(public peopleService:PeopleService) {
    peopleService.people
      .subscribe(people => this.people = people);
  }
  saidHello($event){
    alert(`You said hello to ${$event}`)
  }
}

这是我的 boot.ts

import {bootstrap}    from 'angular2/platform/browser'
import {AppComponent} from './app.component'

bootstrap(AppComponent)
  .catch(err => console.error(err));

和 peopleService.ts

//a simple service
import {Injectable} from 'angular2/core';
import {HTTP_PROVIDERS, Http} from 'angular2/http';

@Injectable()
export class PeopleService {
  constructor(http:Http) {
    this.people = http.get('src/people.json').map(res => res.json());
  }
}

这些是我在控制台中遇到的错误：

“网络错误：404 未找到 - http://127.0.0.1/angular2/http ”

和

错误：XHR 错误（404 未找到）加载 http://127.0.0.1/angular2/http 错误 从http://127.0.0.1/app加载http://127.0.0.1/angular2/http作为“angular2/http” /app.component.js

4

1 回答 1

0

@eric 的回答很有帮助，我只需要更多详细信息。

我为这个问题构建了一个plunker。关键带走了我想做的所有事情 发出一个简单的 http 请求以从文件中获取 json 数据。

希望一个完整的工作示例可以帮助某人。

import {HTTP_PROVIDERS, Http} from 'angular2/http';
于 2016-01-04T16:51:53.963 回答