代码之家  ›  专栏  ›  技术社区  ›  Aakriti.G

路由器链路活动与ngModel不能正常工作

  •  0
  • Aakriti.G  · 技术社区  · 8 年前

    我正在使用路由并使用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 回复  |  直到 8 年前
        1
  •  0
  •   Aakriti.G    8 年前

    自从 getData() 是异步调用。

    通话成功之前 selectedEntry 将为空。

    所以你可以做这两件事中的任何一件

    1. 使用隐藏输入字段

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

    1. 代替

    selectedEntry:any;

    具有

    selectedEntry:any={
        date:''   
    }