VansFannel
VansFannel

Reputation: 45921

Import custom module: how can I set its path?

I've just started to learn Angular 2 and I have a problem to import a custom module with interfaces declaration. This is my folder structure:

enter image description here

I want to import product.interface.ts into a component that it is in app/components/product/product.component.ts which has this import statement:

import { IProduct, IEmvoProduct } from '../../interfaces/product.interface'

I have also tried:

import { IProduct, IEmvoProduct } from '@app/interfaces/product.interface'

But it can find that module.

product.interface.ts is:

interface IProduct {
    productCode: string;
    description: string;
    lawId: number;
    name: string;
    comment: string;
    emvoProduct?: IEmvoProduct; // ?: Optional.
}

interface IEmvoProduct {
    codingScheme: string;
    name: string;
    commonName: string;
    pharmaForm: string;
    strength: string;
    packType: string;
    packSize: number;
}

I want to put the interfaces in a standalone file to shared between another components.

How can I import it?

Upvotes: 0

Views: 60

Answers (1)

Vivek Doshi
Vivek Doshi

Reputation: 58543

This one is perfect :

import { IProduct, IEmvoProduct } from '../../interfaces/product.interface'

I think you forgot to export IProduct, IEmvoProduct from the product.interface.ts file.


For error : product.interface.ts is not a module

Put export keyword before interface IProduct and interface IEmvoProduct

Like :

export interface IProduct {
    productCode: string;
    description: string;
    lawId: number;
    name: string;
    comment: string;
    emvoProduct?: IEmvoProduct; // ?: Optional.
}

export interface IEmvoProduct {
    codingScheme: string;
    name: string;
    commonName: string;
    pharmaForm: string;
    strength: string;
    packType: string;
    packSize: number;
}

Here is the link, please have a look :

https://stackblitz.com/edit/angular-export-interface

Upvotes: 1

Related Questions