Question

我计划将angularjs 1应用程序升级到angularjs2。这里的问题是如何使用angualrjs2中的jquery设置输入值和更新模型值。

这是我的代码：

export class AppComponent {
  public user: User = {
    name: 'John',
    address: {
      address1: '11, High Street'
    }
  }
  ngOnInit() {
      console.log("User name ::"+this.user.name)
      console.log('ngOnInit')
      $('#postcode').val('123456');
  }
  public save(form: IUser, isValid: boolean) {
    console.log(form, isValid);
  }
}

plunkr代码：http://plnkr.co/edit/BGYTpytD7kGMmRODE796

Answer 1

在内部使用角度渲染模型数据，如果必须使用Jquery，则需要删除<input>标记中的数据绑定：改变

<input type="text" class="form-control" name="postcode"
          [(ngModel)]="user.address.postcode" id="postcode">

到

<input type="text" class="form-control" name="postcode"
         id="postcode">

检查演示：http://plnkr.co/edit/RVSwYjaLIPE4Uv4s75oD?p=info

另一种更好的方法就是改变模型：

public user: User = {
name: 'John',
address: {
  address1: '11, High Street',
  postcode : "N14 46T"   // <--------Add postcode property
  }
}

如何在Angularjs2中使用jquery设置输入值和更新模型值？

1 个答案: