Angular2 Http module generates 404 not found error

Question

I'm using Angular2 beta 17 (last version) with ASP.NET core 1 MVC application , i'm trying to use http as the following :

import {Http} from 'Angular2/http';
import "rxjs/add/operator/map"
import { Injectable } from 'angular2/core';
@Injectable()
export class PostsService
{
    constructor(private _http: Http) {
    }
    getPosts()
    {
       return this._http.get("http://jsonplaceholder.typicode.com/posts")
            .map(res => res.json());
    }}

After using the service inside component i got error in chrome : Failed to load resource: the server responded with a status of 404 (Not Found).

Component calling the service as the following :

import {Component} from 'angular2/core';
import {PostsService} from '../services/posts.service'
import {HTTP_PROVIDERS} from 'angular2/http';


@Component({
    selector: 'post-list',
    template:
    `


`,
    providers: [PostsService, HTTP_PROVIDERS]

})
export class PostsComponent
{
    constructor( private _postsService: PostsService)
    {
        this._postsService.getPosts().subscribe(posts => console.log(posts));
    }
}

Note that All js imported in index.html as the following :

<section id="content">
    <div class="container">
        <div class="row">
            <my-app>
                <div class="alert alert-info" role="alert">
                    <h3>Loading...</h3>
                </div>
            </my-app>
        </div>
    </div>
</section>

@section Scripts {
    <script>
        System.config({
            packages: {
                'app': { defaultExtension: 'js' },
                'lib': { defaultExtension: 'js' },
            },
        });

        System.import('app/boot')
            .then(null, console.error.bind(console));
    </script>


}

This looks like a broken SystemJS config and Angular2/http ist probably also not the right import (Angular has a lowercase node module) — Maximilian Riegler
– Maximilian Riegler, Commented Jul 18, 2016 at 12:07

Thierry Templier · Accepted Answer · 2016-07-18 12:18:40Z

1

With Angular2 beta versions, you need to include the http.js file in your main HTML file:

<script src="node_modules/angular2/bundles/angular2-polyfills.js"></script>
<script src="node_modules/systemjs/dist/system.src.js"></script>
<script src="node_modules/rxjs/bundles/Rx.js"></script>
<script src="node_modules/angular2/bundles/angular2.dev.js"></script>
<script src="node_modules/angular2/bundles/http.dev.js"></script> <-----

With RC versions, things changed since now you need to configure Angular2 modules (included the HTTP one) with your SystemJS configuration

answered Jul 18, 2016 at 12:18

Thierry Templier

203k44 gold badges407 silver badges365 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Angular2 Http module generates 404 not found error

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related