Cannot find name '$' in component.ts

Question

I got error:'Cannot find name '$' in component' on compile time of angular web-app. When i used const $ : any = ''; then solved error but getting a another error in browsers console: 'core.js:1440 ERROR TypeError: $ is not a function' and also datatable not working when used const $ : any = '';.

Below is my code of users component. This component is used for list of users into datatable.

users.component.ts

import {DataService} from './../services/data.service';
import {Component, OnInit} from '@angular/core';
import {API_ENDPOINT} from '../app.module';
import {Response} from '@angular/http/src/static_response';


const $: any = '';

@Component({
    selector: 'app-users',
    templateUrl: './users.component.html',
    styleUrls: ['./users.component.css']
})
export class UsersComponent implements OnInit {

    private url = API_ENDPOINT + '/admin_api/users';
    private users: any;

    constructor(private dataService: DataService) {
    }

    ngOnInit() {
        this.dataService.get(this.url)
            .subscribe(responce => {
                this.users = responce.data.users;
                if (this.users) {
                    setTimeout(function () {
                        var oTable1 = $('#sample-table-2').dataTable({
                            "aoColumns": [
                                {"bSortable": false},
                                null, null, null, null, null,
                                {"bSortable": false}
                            ],
                        });
                    }, 3000);
                }
            })
    }
}

Answer 1

• In the console First install jQuery

npm install --save jquery

• And install jQuery Definition

npm install -D @types/jquery

• call your jquery in your componenet

import {DataService} from './../services/data.service';
import {Component, OnInit} from '@angular/core';
import {API_ENDPOINT} from '../app.module';
import {Response} from '@angular/http/src/static_response';
import * as $ from 'jquery';// import Jquery here    
.
.
your code
.
.

• And don't need use const $: any = '';, You should remove this declaration.

Answer 2

I have seen similar and solution which worked for me was,

1. Install jQuery

   npm install jquery --save

2. Install type jQuery

   npm install @types/jquery

3. Import it into your module

   //THis is important import * as $ from 'jquery';

Hope this will help!

Answer 3

install jQuery

npm install --save jquery

And install jQuery Definition

npm install -D @types/jquery

** than include jquery in component like this **

import * as $ from jquery