Solution 1 :

To begin with, you don’t need the {{ }} operator in *ngIf="href == articulo.index"

Solution 2 :

Try this:

<h2> Menu : </h2>
<div  class="alert alert-warning" role="alert"  *ngFor="let articulo of menus">
    <p>{{href}}</p>
    <p>{{articulo.index}}</p>
    <div *ngIf="href === articulo.index">
        <h3>
            <a href="#" [title]="articulo.Nombre + ' Menu'">{{articulo.Nombre}}</a>
        </h3>
        <img [src]="articulo.Url" width="450" height="450"/>
     </div>  
 </div>

Problem :

what I’m trying to do is to show certain elements of a list that I have on firebase database, by trying to compare the url that I’m generating in the path and a attribute that the element has(index). All this in Angular.

This is my .ts code:

import { Component, OnInit } from '@angular/core';
import { ConexionService } from 'src/app/services/conexion.service';
import { Router } from '@angular/router'
import { from } from 'rxjs';

@Component({
  template: 'The href is: {{href}}',
  selector: 'app-articulos',
  templateUrl: './articulos.component.html',
  styleUrls: ['./articulos.component.css']
})
export class ArticulosComponent implements OnInit {
  public href: string = "";

  menus: any;
  constructor(private conexion: ConexionService, private router: Router) { 
    this.conexion.menuLista().subscribe(menu => {
      this.menus = menu;
    })
  }

  ngOnInit(): void { 
    var r = (this.router.url).split("/");
    this.href = r[3];
    console.log(this.href);
  }
}

And this is my html(I know that is very simple, I’m starting):

<h2> Menu : </h2>
<div  class="alert alert-warning" role="alert"  *ngFor="let articulo of menus">
  <div *ngIf="{{href}} == {{articulo.index}}">
    <h3>
      <a [title]="articulo.Nombre + ' Menu'">
        {{articulo.Nombre}}
        </a>
     </h3>
    <img src={{articulo.Url}} width="450" height="450"/>
  </div>  
 </div>

Obviously the code is not working, but idk how to compare those thing so I can show the elements of the list that have the same index than the path. An example would be: route=/restaurantes/articulos/0, so the var r would be 0 and then the idea is to show the elements that have has an attribute index=”0″

By