Активная ссылка на маршрутизатор не работает должным образом с ngModel

Я работаю с маршрутизацией и использую routerLinkActive, чтобы сделать ссылку активной. Ссылка не активируется при использовании ngModel в html.

Это точный сценарий ..

В компоненте я вызываю веб-службу, которая возвращает объект или массив объектов. В html я использую ngModel для полей объекта. Активная ссылка на маршрутизатор отлично работает, если я использую прямые поля, такие как строка или число. Но это не работает, когда я пытаюсь получить доступ к полям объекта.

Это странно.

Вот что я пытаюсь сделать.

ts:

export class MyComponent implements OnInit {
    headers;
  allLogs: Array<any> = [];
  selectedEntry: any;

    ngOnInit() {
        var token = localStorage.getItem('x-auth-token');
        this.headers = new Headers({
           'x-auth-token' : token
        });
        this.getData(this.headers);
    }

    getData(headers){
      this.exampleProvider.getAllEntries(headers)
      .subscribe(
        data => {
          this.allLogs = JSON.parse(data['_body'])
          this.selectedEntry = JSON.parse(JSON.stringify(this.allLogs[0]))
        },
        error => {
        }
      );
  }

  updateDate(event){
  }

}

html:

<p>{{selectedEntry | json}}</p>

<input class="form-control" type="date" [ngModel]="selectedEntry.date" name="selectedDate" (ngModelChange)="updateDate($event)">

Когда я использую selectedEntry в ngModel, он работает нормально, а после получения даты он не работает.

Нужна помощь.


person Aakriti.G    schedule 19.12.2017    source источник


Ответы (1)


Поскольку getData() - это асинхронный вызов.

Прежде чем вызов будет успешным, selectedEntry будет нулевым.

Итак, вы можете сделать одно из этих действий

  1. Скрыть поле ввода с помощью

<input class="form-control" *ngIf="selectedEntry!=null" type="date" [ngModel]="selectedEntry.date" name="selectedDate" (ngModelChange)="updateDate($event)">

OR

  1. Заменять

selectedEntry:any;

с участием

selectedEntry:any={
    date:''   
}
person Deepak Kumar T P    schedule 19.12.2017