angular2-services

I'm trying to create a generalized data service in Angular 2, and I'm encountering a strange error. Essentially, I'm creating an HTTP service whose methods take in part of the api url so that I can use it for multiple cases. For example, I would like to pass in 'projects/' and join it with 'api/' to get 'api/projects/' which I could then use in the http calls. My current dataService.ts: import { Injectable } from '@angular/core'; import { Http, Response, Headers } from '@angular/http'; import 'rxjs/add/operator/map' import { Observable } from 'rxjs/Observable'; import { Configuration } from '.

I recently came to know that we must unsubscribe the subscription before Angular destroys the component, and failure to do so could create a memory leak. I also know that we can get a reference to the subscription and by calling unsubscribe method on that subscription we can subscribe. For example private sub: any; ngOnInit() { this.sub = this.route.params.subscribe(params => { let id = +params['id']; // (+) converts string 'id' to a number this.service.getHero(id).then(hero => this.hero = hero); }); } ngOnDestroy() { this.sub.unsubscribe(); } Is this necessary in the case of HTTP calls as

Here's my scenario : Il get straight to the point first... I want to load all the routes including the default route of a app in RouteConfig through a service. I am able to do so but cannot load the default route dynamically, other routes can be loaded dynamically. Suppose i bootstrap(AppComponent) and my AppComponent view only content is <router-outlet></router-outlet> so in this scenario the AppComponent RouteConfig needs to be loaded dynamically i.e in my case i call a service which returns a JSON in this format [ { "path" : "/child1" , "name" : "Child1" , "component" : "ChildComponent1",

In my resolve guard I am getting an Http Observable to return the JSON of a user from a particular id . I want to catch an error and reroute to the users overview if the id does not exist. I have seen code that solves that with a Promise, but not with an Observable. I would like to see a solution with an Observable! Currently I get an "EXCEPTION: Uncaught (in promise): Response with status: 404 Not Found for URL: http://127.0.0.1:3000/users/191" since user 191 does not exsist. Here is my code: Resolve: import { Injectable } from '@angular/core'; import { Resolve, ActivatedRouteSnapshot,

I am pulling data from an API using an Angular 2 service.. I can output everything from the json api onto the page using something similar to this {{ project.title }} however i wish to output the url to a background image and I cant seem to get it working.. has anyone got any ideas or advice ? Currently this is what I have. I've tried it without the curly braces also but nothing is working. <div class="table-wrap featuredimg" [ngStyle]="{'background-image': 'url(' + {{ project.projectimage }} + ')'}"> You don't need use {{}} for call some propiety than you put in a directive, like this: import

I have a .net web api hosted on IIS 7 on a remote server which uses windows authentication. I want to access the web api using Angular 2 using TypeScript with node . Earlier i was getting an error 'Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource' I added this on the hosted Application's web.config <httpProtocol> <customHeaders> <add name="Access-Control-Allow-Origin" value="*" /> </customHeaders> But now i get Unauthorised 401 error. I have read about adding the following code to allow cross domain

I have implemented lazy loading modules into my application, the app.module.ts is configured correctly. @NgModule({ declarations: [ AppComponent, HeaderComponent, HomeComponent ], imports: [ BrowserModule, FormsModule, HttpModule, routing ], bootstrap: [AppComponent] }) export class AppModule { } The routing configuration const APP_ROUTES: Routes = [ { path: '', component: HomeComponent }, { path: 'tools', loadChildren: 'app/tools/tools.module#ToolsModule' } ]; export const routing = RouterModule.forRoot(APP_ROUTES); Providing a service through the providers field in the child module and

How can i detect browser close event in angular 4.0.2 I have tried @HostListener('window:unload', ['$event']) unloadHandler(event) { ... } @HostListener('window:beforeunload', ['$event']) beforeunloadHandler(event) { ... } But not properly working for me. Can anyone help me out. If i refresh page than also this event fires Need Separate browser close event in angular2/4 You need to set $event.returnValue if you want close event popup Inside component @HostListener('window:beforeunload', ['$event']) public beforeunloadHandler($event) { $event.returnValue = "Are you sure?"; } 来源： https:/