CODEWITHSUNDEEP
angular
DragonBorn
DragonBorn

Reputation: 1809

Linking Services to components

I am importing my service in my component but for some reason it gives me cannot find module.

Here's my selectHotel.component.ts

import { Component } from '@angular/core';
import { GetHotelService } from '/src/app/services/gethotel/getHotel.service'; //Error Here

@Component({
    moduleId: module.id,
    selector: 'selectHotel',
    templateUrl: 'selectHotel.component.html',
    providers: [GetHotelService]
})
export class selectHotelComponent  {  }

Here's my getHotel.service.ts

import {Injectable} from '@angular/core';
import {Http} from '@angular/http';
import 'rxjs/add/operator/map';

@Injectable()
    export class GetHotelService {
        constructor(private http: Http){
            console.log('Init');
        }
    }

My project folder view is like this

Proj > src > app > components > selectHotel > selectHotel.component.ts

Proj > src > app > services > gethotel > getHotel.service.ts

What am I doing wrong here?

Upvotes: 1

Views: 293

Answers (2)

snorkpete
snorkpete

Reputation: 14564

It's best to use relative paths when importing items you wrote in your project.

so change your GetHotelService import to something like,

import { GetHotelService } from '../../services/gethotel/getHotel.service';

The leading .. (or ./ in other cases) indicates that this is a relative import.

PS.

Not to be too pedantic, but you may want to look at a different folder structure for your project - it's usually a better idea to group items that are related to a specific feature together, rather than grouping them by type. In other words, put your Hotel service in the same folder with your Hotel component, rather than grouping all your services together and separate from your components.

See the Angular Style guide for more information.

Upvotes: 1

eko
eko

Reputation: 40647

The import path should be relative to the current file

Try:

import { GetHotelService } from '../../services/gethotel/getHotel.service';

Upvotes: 2

Related Questions