Angular - Cannot find name 'Injectable' - Solved

This post is focused on Cannot find name 'Injectable' in angular. This post will give you simple example of angular error ts2304 cannot find name 'Injectable'. In this article, we will implement a angular cannot find Injectable error. I’m going to show you about angular cannot find name Injectable.

You can use this solution with angular 8, angular 9, angular 10, angular 11, angular 12, angular 13, angular 14, angular 15, angular 16 and angular 17 version.

In this post, I will give you the solution of "Cannot find name 'Injectable'" in angular application. we need to import Injectable from @angular/core library. so let's see below the solution and full code.

Solution:

let's import Injectable from @angular/core npm package, as bellow:

Import Output:

import { Injectable } from '@angular/core';

Let's see bellow working code:

Example:

import { Component, OnInit, Inject, Injectable } from '@angular/core';
import { DOCUMENT } from '@angular/common';
  
@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit {
  
    port = '';
  
    /*------------------------------------------
    --------------------------------------------
    constructor
    --------------------------------------------
    --------------------------------------------*/
    constructor(@Inject(DOCUMENT) private document: any) { }
  
    /*------------------------------------------
    --------------------------------------------
    ngOnInit
    --------------------------------------------
    --------------------------------------------*/
    ngOnInit() {
        this.port = this.document.location.port;
        console.log(this.port);
    }
  
}

I hope it can help you...