Post
Ask Question
ahmed elbarbary

ahmed elbarbary

  • NA
  • 1.6k
  • 277.8k

using jquery on angular 7 not working and not make red to di

Feb 6 2020 3:36 AM
problem
 
using jquery on angular 7 not working and not make red to different rows ?
 
I using jquery on angular 7 but when using this jquery code not working 
  1. import { Component, OnInit } from '@angular/core';    
  2. import * as $ from 'jquery';    
  3. @Component({    
  4.   selector: 'app-root',    
  5.   templateUrl: './app.component.html',    
  6.   styleUrls: ['./app.component.css']    
  7. })    
  8. export class AppComponent implements OnInit  {    
  9.   title = 'TestIndexSolution';    
  10.   constructor() {    
  11.     // Called first time before the ngOnInit()    
  12.  }    
  13.     
  14.  ngOnInit() {    
  15.     
  16.   $(function () {    
  17.          
  18.           $("#table1").find("tr").each(    
  19.               function () {    
  20.                   var tds = $(this).find("td");    
  21.                   var value = tds.eq(0).text();    
  22.                   tds.each(    
  23.                       function () {    
  24.                           if (this.innerText != value) {    
  25.                               tds.css("color", "red");    
  26.                               return false;    
  27.                           }    
  28.                       }    
  29.                   )    
  30.               }    
  31.           )  
  32.   })  
  33.     // Called after the constructor and called  after the first ngOnChanges()   
  34.  }    
  35. } 
  1. <html>    
  2. <head>    
  3.   <script src="Scripts/jquery-3.3.1.min.js">script>    
  4. <head>    
  5. <body>    
  6. <table border="1">    
  7. <col width="500">    
  8. <col width="500">    
  9. <col width="500">    
  10. <col width="500">    
  11. <tr bgcolor="#6699FF" width="100%">    
  12.     <th>Part1</th>    
  13.     <th>Part2</th>    
  14.     <th>Part3</th>    
  15.     <th>Part4</th>    
  16. <tr>    
  17.     <td>12</td>    
  18.     <td>12</td>    
  19.     <td>12</td>    
  20.     <td>12</td>    
  21. </tr>    
  22. <tr>    
  23.     <td>12</td>    
  24.     <td>15</td>    
  25.     <td>12</td>    
  26.     <td>12</td>    
  27. </tr>    
  28. <tr>    
  29.     <td>17</td>    
  30.     <td>15</td>    
  31.     <td>12</td>    
  32.     <td>12</td>    
  33. </tr>    
  34. </table>    
  35.     
  36. </body>    
  37. </html>

Answers (3)