首页 文章

路由器链路活动与ngModel无法正常工作

提问于
浏览
0

我正在使用路由并使用routerLinkActive使链接处于活动状态 . 在html中使用ngModel时未激活链接 .

这是确切的情况..

在组件中,我调用Web服务,它返回一个对象或对象数组 . 在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)">

当我在ngModel中使用selectedEntry然后它工作正常,并在检索日期后它无法正常工作 .

需要帮忙 .

1 回答

  • 0

    由于 getData() 是异步调用 .

    在呼叫成功之前 selectedEntry 将为空 .

    所以你可以做其中任何一件事

    • 使用隐藏输入字段

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

    要么

    • 替换

    selectedEntry:any;

    selectedEntry:any={
        date:''   
    }
    

相关问题