Jquery in angular

How to use jquery in angular

import {bootstrap}    from '@angular/platform-browser-dynamic';
import {Component, ViewChild, ElementRef, AfterViewInit} from '@angular/core';
declare var $:JQueryStatic;

@Component({
    selector: 'ng-chosen',
    template: `<select #selectElem>
        <option *ngFor="#item of items" [value]="item" [selected]="item === selectedValue">{{item}} option</option>
        </select>
        <h4> {{selectedValue}}</h4>`
})
export class NgChosenComponent implements AfterViewInit {
    @ViewChild('selectElem') el:ElementRef;
    items = ['First', 'Second', 'Third'];
    selectedValue = 'Second';

    ngAfterViewInit() {
        $(this.el.nativeElement)
            .chosen()
            .on('change', (e, args) => {
                this.selectedValue = args.selected;
            });
    }
}

bootstrap(NgChosenComponent);

Source: stackoverflow.com

Use jquery in angular

// In the console
// First install jQuery
npm install --save jquery
// and jQuery Definition
npm install -D @types/jquery

=======================================(in angular)
import * as $ from 'jquery';
//
$('#elemId').width();

// OR

// CommonJS style - working with "require"
import $ = require('jquery')
//
$('#elemId').width();

-1

Source: stackoverflow.com

Similar codes

1 vote197 views1 answer
Typescript function parameters optional destruct
TypeScript
0 vote189 views1 answer
About half of divorced parents try to avoid each other after the divorce, creating a different set of rules for children to follow in each parent’s household. This type of parental interaction is called
TypeScript
0 vote225 views1 answer
Whats the next sonic game
TypeScript
2 votes218 views1 answer
What are benefits of zip files
TypeScript
1 vote228 views1 answer
Ng : File C:\Users\Sriram\AppData\Roaming\npm\ng.ps1 cannot be loaded because running scripts is disabled on this system. For more information, see about_Execution_Policies at https:/go.microsoft.com/fwlink/?LinkID=135170.
TypeScript
-1 vote213 views1 answer
Typescript declaring null
TypeScript
0 vote220 views1 answer
A korean movie where a man gets kidnapped by a family
TypeScript
0 vote207 views1 answer
Vim show different parts of same file
TypeScript
0 vote222 views1 answer
DISTINQUISH BETWEEN THE AVERAGE CASE AND WORSE CASE RUNNING TIME AND THE FACTORS AFFECTING THAT AFFECTS THE RUNNING TIME OF AN ALGORITHM
TypeScript
1 vote233 views1 answer
Gets ents within range gmod lua
TypeScript