I didn't realize you could put @Inject in like that but once I read what
you had it made sense.
I initially had:
import {HTTP_Providers, Http} from 'angular2/http';
In my service but I was getting the 'unknown provider' message even after I
resolved my Http issue in SystemJs(and Html). So I ended up moving
HTTP_PROVIDERS to my boot.ts which fixed it:
*import* {bootstrap} *from* 'angular2/platform/browser'
*import* {HTTP_PROVIDERS} *from* 'angular2/http'
*import* {AppComponent} *from* './app.component'
// need the HTTP_PROVIDERS here so we can inject them into the
main-menu.service.ts
bootstrap(AppComponent, [HTTP_PROVIDERS]);
Now my main-menu.service.ts just has the:
import {Http} from 'angular2/http';
On Thursday, January 14, 2016 at 3:15:58 PM UTC-5, michael corbridge wrote:
>
> I had this happen as well. I needed to do this in the constructor:
>
> constructor(@Inject(Http) http: Http) {
> console.log('DataService constructor .....');
> this.http = http;
> }
>
>
> In addition, HTTP_PROVIDERS must be set in the providers, i.e.
>
> providers: [MockService, HTTP_PROVIDERS, DataService],
>
>
> Is it me, or does this see overly complicated?
>
>
>
> On Thursday, January 14, 2016 at 1:52:40 PM UTC-5, Justin Bleach wrote:
>>
>> I'm using SystemJS; which I am also new to. I've done some reading but
>> not sure if this would be correct to add to my current config:
>>
>> System.config({
>>
>> packages: {
>>
>> app: {
>>
>> format: 'register',
>>
>> defaultExtension: 'js'
>>
>> }
>>
>> }
>>
>> });
>>
>> System.import('app/boot')
>>
>> .then(null, console.error.bind(console));
>>
>> System.register('node_modules/angular2/http');
>>
>> On Thursday, January 14, 2016 at 1:08:05 PM UTC-5, Pawel Kozlowski wrote:
>>>
>>> What is your setup (SystemJS? WebPack? something else?). If it is
>>> SystemJS you need to include http bundle, see:
>>>
>>> https://github.com/angular/angular/blob/master/modules/angular2/docs/bundles/overview.md
>>>
>>>
>>> Cheers,
>>> Pawel
>>>
>>> On Thu, Jan 14, 2016 at 6:06 PM, Justin Bleach <[email protected]>
>>> wrote:
>>> > I can import core without any problems doing this:
>>> >
>>> > import {Component} from 'angular2/core';
>>> >
>>> > But for some strange reason when I import http and use it:
>>> >
>>> > import {HTTP_PROVIDERS, Http} from 'angular2/http';
>>> >
>>> > I get this stack trace in the Chrome console:
>>> >
>>> > Error: XHR error (404 Not Found) loading
>>> > http://localhost:8080/pocApp/angular2/http
>>> > Error loading http://localhost:8080/pocApp/angular2/http as
>>> "angular2/http"
>>> > from http://localhost:8080/pocApp/app/main-menu.service.js
>>> > at error
>>> > (
>>> http://localhost:8080/pocApp/node_modules/systemjs/dist/system.src.js:1020:16)
>>>
>>>
>>> > at XMLHttpRequest.xhr.onreadystatechange [as _onreadystatechange]
>>> > (
>>> http://localhost:8080/pocApp/node_modules/systemjs/dist/system.src.js:1028:13)
>>>
>>>
>>> > at Zone.run
>>> > (
>>> http://localhost:8080/pocApp/node_modules/angular2/bundles/angular2-polyfills.js:138:17)
>>>
>>>
>>> > at XMLHttpRequest.zoneBoundFn
>>> > (
>>> http://localhost:8080/pocApp/node_modules/angular2/bundles/angular2-polyfills.js:111:19)
>>>
>>>
>>> >
>>> > I'm not new to Angular but of course I am new to Angular2. I've
>>> followed the
>>> > 5 min quickstart followed by the Hero's example. So I can see in my
>>> > node_modules/angular2 directory both the core.js and http.js files.
>>> >
>>> > I feel like I've got something wrong that is simple to fix but I
>>> honestly
>>> > can't see what.
>>> >
>>> > Here is the entire JS where http is used if it helps:
>>> >
>>> > import {Injectable} from 'angular2/core';
>>> >
>>> > import {HTTP_PROVIDERS, Http} from 'angular2/http';
>>> >
>>> >
>>> > @Injectable()
>>> >
>>> > export class MainMenuService {
>>> >
>>> > http:Http;
>>> >
>>> > constructor(http:Http) {
>>> >
>>> > this.http = http;
>>> >
>>> > }
>>> >
>>> >
>>> >
>>> > getMainMenuItems() {
>>> >
>>> > return
>>> > this.http.get('http://localhost:8080/pocApp/class/list').map(res =>
>>> > res.json())
>>> >
>>> > }
>>> >
>>> > }
>>> >
>>> > --
>>> > You received this message because you are subscribed to the Google
>>> Groups
>>> > "AngularJS" group.
>>> > To unsubscribe from this group and stop receiving emails from it, send
>>> an
>>> > email to [email protected].
>>> > To post to this group, send email to [email protected].
>>> > Visit this group at https://groups.google.com/group/angular.
>>> > For more options, visit https://groups.google.com/d/optout.
>>>
>>>
>>>
>>> --
>>> AngularJS book:
>>> http://www.packtpub.com/angularjs-web-application-development/book
>>> Looking for bootstrap-based widget library for AngularJS?
>>> http://angular-ui.github.com/bootstrap/
>>>
>>
--
You received this message because you are subscribed to the Google Groups
"AngularJS" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at https://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.
