CODEWITHSUNDEEP
angular
El Hombre Sin Nombre
El Hombre Sin Nombre

Reputation: 3092

Angular - Compare strings

The problem is simple:

I need compare current user with list of users 

<tr *ngFor="let user of users">
     <td>
     <a *ngIf="'user.usuario' != usuario" title="{{'delete' | translate}}" 
          (click)="delete(user)"><i class="fas fa-trash"></i></a> 
     </td>
</tr>

Current user is usuario and user.usuario is a users for loop. When user.usuario!=usuario i need to show this element, when is user.usuario==usuario i need to hide it.

The problem: This condition doesn´t works. What´s is wrong? {{usuario}} return value.

UPDATE

Array of users

0: {idUsuario: 20, usuario: "iotadmin", nombre: null, apellidos: null, …}
1: {idUsuario: 21, usuario: "xiborra", nombre: "Xavi", apellidos: "Iborra", …}
2: {idUsuario: 22, usuario: "sergio", nombre: "Sergio", apellidos: "Hernando", …}
3: {idUsuario: 23, usuario: "alara", nombre: "Asier", apellidos: "Lara", …}
4: {idUsuario: 25, usuario: "jmanrique", nombre: "Jorge", apellidos: "Manrique", …}
5: {idUsuario: 26, usuario: "jaltamira", nombre: "Jorge", apellidos: "Altamira", …}
length: 6
__proto__: Array(0)

User

console.log(this.usuario) 

alara

In HTML {{usuario}} return

[OBJECT][OBJECT]

Upvotes: 2

Views: 2589

Answers (3)

Ganesh
Ganesh

Reputation: 6016

Use triple equals (===) for comparing and add a method which convert usuario to string value.

 <tr *ngFor="let user of users">
         <td>
         <a *ngIf="user.usuario !== getUserio()" title="{{'delete' | translate}}" 
              (click)="delete(user)"><i class="fas fa-trash"></i></a> 
         </td>
    </tr>

In Component :

 getUserio() {
    return JSON.stringify(this.usuario);
 }

I know it's costly to call a method from directive but this looks possible way to solve this issue. :)

Upvotes: 0

Rohit Grover
Rohit Grover

Reputation: 113

I have run and verified this sample in https://stackblitz.com

Please follow below thread -

In component i have added a static array named "users"

export class AppComponent  {    
users=[{"usuario":"iotadmin","idUsuario":1},
{"usuario":"xiborra","idUsuario":2},
{"usuario":"sergio","idUsuario":3},
{"usuario":"alara","idUsuario":4},
{"usuario":"jmanrique","idUsuario":5},
{"usuario":"jaltamira","idUsuario":5}];
currentUser='iotadmin';
}

and in HTML -

<tr *ngFor="let user of users">
 <td>      
 <a *ngIf="user.usuario != currentUser" title="{{'delete'}}" 
      (click)="delete(user)">{{user.usuario}} <i class="fa fa-trash">delete</i></a> 
 </td>
</tr>

The output will be displayed as -

xiborra delete  
sergio delete   
alara delete
jmanrique delete
jaltamira delete

it hides user "iotadmin" which is the current user.

Hope it helps:)

Upvotes: 0

Adrita Sharma
Adrita Sharma

Reputation: 22213

Replace 'user.usuario' with user.usuario, don't add the quote.

Try this:

<a *ngIf="user.usuario != usuario" title="{{'delete' | translate}}" 
              (click)="delete(user)"><i class="fas fa-trash"></i></a>

Upvotes: 5

Related Questions