路由器 link 活动未与 ngModel 一起正常工作
Router link active is not working properly with ngModel
我正在处理路由并使用路由器LinkActive 激活link。 Link 在 html.
中使用 ngModel 时未激活
这正是场景..
在组件中,我调用 Web 服务,其中 returns 一个对象或对象数组。在 html 中,我将 ngModel 用于对象的字段。如果我使用字符串或数字等直接字段,路由器 link 活动工作正常。但是当我试图从对象访问字段时它不起作用。
很奇怪。
这是我正在尝试做的事情。
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 时,它工作正常,但在检索日期后它不起作用。
需要帮助。
自从
getData()
是异步调用。
调用成功前selectedEntry
将为null。
所以你可以做这些事情
- 使用
隐藏输入字段
<input class="form-control" *ngIf="selectedEntry!=null" type="date" [ngModel]="selectedEntry.date" name="selectedDate" (ngModelChange)="updateDate($event)">
或
- 替换
selectedEntry:any;
和
selectedEntry:any={
date:''
}
我正在处理路由并使用路由器LinkActive 激活link。 Link 在 html.
中使用 ngModel 时未激活这正是场景..
在组件中,我调用 Web 服务,其中 returns 一个对象或对象数组。在 html 中,我将 ngModel 用于对象的字段。如果我使用字符串或数字等直接字段,路由器 link 活动工作正常。但是当我试图从对象访问字段时它不起作用。
很奇怪。
这是我正在尝试做的事情。
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 时,它工作正常,但在检索日期后它不起作用。
需要帮助。
自从
getData()
是异步调用。
调用成功前selectedEntry
将为null。
所以你可以做这些事情
- 使用 隐藏输入字段
<input class="form-control" *ngIf="selectedEntry!=null" type="date" [ngModel]="selectedEntry.date" name="selectedDate" (ngModelChange)="updateDate($event)">
或
- 替换
selectedEntry:any;
和
selectedEntry:any={
date:''
}