如何使用 Nativescript 自动保存 formControlName答案

【问题标题】：How to autosave a formControlName using Nativescript如何使用 Nativescript 自动保存 formControlName
【发布时间】：2019-02-08 15:18:12
【问题描述】：

我在 .html 中有这个 TextField

<TextField class="textfield" row="0" col="1" formControlName="powersupplyid" [text]='myipdevice'> </TextField>

我想在“myipdevice”显示在视图中时自动保存此功能。

getform() {
    ..........
     .....
        this.myipdevice = myipfind;
        console.log('u gjet', this.myipdevice)
        let LS = require("nativescript-localstorage");
        LS.setItem(this.myipdevice);
    }

你能问我如何在 html 中显示数据时自动保存值 myipdevice 吗？

谢谢！

【问题讨论】：

您应该提供更多代码，例如支持此视图的组件。
我有一个返回myipdevice的函数。在表单中显示时如何自动保存此 myipdevice？
@Knelis 我编辑我的帖子。谢谢！

标签： angular typescript nativescript autosave

【解决方案1】：

它已经被保存到你的表单对象中，不管你怎么称呼它.. 假设您将其称为“表单”

那么this.form.controls.powersupplyid.value 的值应该会在您在文本区域内输入或执行任何操作时自动更新

【讨论】：

@new_user 我仍然不确定你想要发生什么......你想更新本地存储值以在每次用户更新 TextField 值时更新它的保存值吗？
是的，我想要那里

【解决方案2】：

现在你似乎在做两件事。一方面，您将TextField 绑定到带有formControlName 的反应式表单字段，另一方面，您还绑定了[text] 属性。我建议只使用formControlName。

在您的组件中，您可以在检索到该值后将其推送到控件。（由于您还没有发布完整的代码，我在这里做一些假设。）

所以在示例中的ngOnInit 方法中，您可以从存储中检索保存的值。然后用patchValue 更新您的FormGroup 以将更改推送到视图。

此外，您可以通过订阅valueChanges 来收听控件的更改。

export class IpDeviceFormComponent implements OnInit {

  form: this.fb.group({
    powersupplyid: [''] // this is the FormControl bound to your TextField
  });

  constructor(private fb: FormBuilder) { }

  ngOnInit() {
    // get a previously saved value from somewhere
    getSavedPowerSupplyId().subscribe(id => {
      this.form.patchValue({
        powersupplyid: id
      });
    });

    // listen for any changes to the form
    this.form.valueChanges.subscribe(form => { /* Save new form state */ });
  }
}

【讨论】：