I need to do a http request to a mail chimp subscription list via a component post
I\'ve read the mail chimp documentation and couldnt find anything
I finally found out how to fix your issue. You need to use the Jsonp support of Angular2.
Your address supports Jsonp by adding a c
query parameter to your URL and switching https://mysubscriptionlist.us10.list-manage.com/subscribe/post
by https://mysubscriptionlist.us10.list-manage.com/subscribe/post-json
. You need to put the JSONP_CALLBACK
value in it (see this issue: https://github.com/angular/angular/issues/5613).
In this case, you will have the following response payload:
JSONP_CALLBACK (
{
"result": "success",
"msg": "Almost finished... We need to confirm your email address. To complete the subscription process, please click the link in the email we just sent you."
}
)
After having registered JSONP_PROVIDERS when calling the bootstrap
function:
import {bootstrap} from 'angular2/platform/browser'
import {JSONP_PROVIDERS} from 'angular2/http'
import {AppComponent} from './app.component'
bootstrap(AppComponent, [ JSONP_PROVIDERS ]);
You can then execute your request using an instance of the Jsonp
class you injected from constructor:
import {Component} from 'angular2/core';
import {Jsonp} from 'angular2/http';
@Component({
selector: 'my-app',
template: `
<div>
Result: {{result | json}}
</div>
`
})
export class AppComponent {
constructor(jsonp:Jsonp) {
var url = 'https://mysubscriptionlist.us10.list-manage.com/subscribe/post-json?u=(...)&subscribe=Subscribe&EMAIL=my@email.com&c=JSONP_CALLBACK';
jsonp.request(url, { method: 'Get' })
.subscribe((res) => {
this.result = res.json()
});
}
}
See this plunkr for a working sample: http://plnkr.co/edit/dqreqBL6kyNkR8Z2wgGR?p=preview