How to use Angular component value in jquery Angular 2

Posted by Dharmraj under Angular category on | Points: 40 | Views : 1086
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: Vikasdotnet on: 6/12/2018 Level:Starter | Status: [Member] | Points: 10
very nice article you shared.
if you want to know the technologies updates,visit below site.

Login to post response