ngFor in not binding to HTML element

Question

I have simply created the service and registering it in component. But while fetching data from service "ngFor" is not working. It's showing the following error:

Property binding ngforFor not used by any directive on an embedded template. Make sure that the property name is spelled correctly and all directives are listed in the "@NgModule.declarations".

This is my code,

import { Component, Input, OnInit } from '@angular/core';

import { UserService } from '../user.service';

@Component({
  selector: 'app-tutorial',
  template: `<p>tutorial works!</p>
          <p> {{userName | uppercase}} </p>
          <ul *ngfor="let user for users">
              <li>{{user.name}}</li>

          </ul>
        `
  })
export class TutorialComponent implements OnInit {
  @Input()
  public userName:String;

  users=[];

  constructor(private _userService: UserService){  }

  ngOnInit(){
    this.users=this._userService.getUsers();
  }


}

this is my service,

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

@Injectable()
export class UserService {
getUsers(){
  return[
    {'id':1,'name':'Jyoti','password':'123'}
    ];
  }


}

And here in appcomponent i have registered the service,

import { Component } from '@angular/core';
import {TutorialComponent} from './tutorial/tutorial.component';
import { UserService } from './user.service';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css'],
  providers:[UserService]
})  
export class AppComponent {

  title = 'My Angular2 Login App';
  public msg1:string;
  public uname;
  public psw;
  onClick (value1,value2) {
    console.log('Username: '+value1+', password:' +value2);
  }

}

Please suggest solution for it.

Answer 1

Issue is because "*ngfor" use "*ngFor"

 <ul *ngFor="let user for users">
          <li>{{user.name}}</li>

  </ul>