How to use Angular component value in jquery Angular 2

Posted by Dharmraj under Angular category on | Points: 40 | Views : 1959
When you want to use Angular component value inside jquery or javascript block then you can store angular component reference in another variable before start jquery block.

After that inside jquery block you will have angular angular reference into temporary variable and this will reference to jquery document or whatever javascript elemnt object.

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

selector: 'my-app',
template: '<div>Hello</div>',
styles: ['.body{}'],

export class AppComponent implements OnInit {
title = 'Tour of Heroes';

getData: void {
let tmpThis = this; //temporary reference of currect component object

//jquery script begin
$(document).ready(function () {
console.log("Jquery variable : "+this.title);
console.log("Angular variable : "+tmpThis.title);
//jquery script end

Comments or Responses

Posted by: Pandyamanav on: 11/24/2017 Level:Starter | Status: [Member] | Points: 10
Nice share bro , its somehow useful kind of stuff

Thanks for sharing
Posted by: Dharmraj on: 11/24/2017 Level:Starter | Status: [Member] | Points: 10
Thanks brother @Manav Pandya
Posted by: Clydeanderson on: 1/18/2019 Level:Starter | Status: [Member] | Points: 10
You can check this website if you still need help. Feel free to do that, friend! I am ready to help you.

Login to post response