从反应形式 valueChanges 中删除空对象值答案

【问题标题】：remove empty object value from reactive form valueChanges从反应形式 valueChanges 中删除空对象值
【发布时间】：2018-11-05 08:46:27
【问题描述】：

我在角度应用中有反应形式。我订阅它 valueChanges 和在得到 subscribe 方法的结果之前，想用 rxjs filter 或类似的方法过滤这个对象，只得到不为空的结果形式。我该如何解决这个问题？

this.form.valueChanges.pipe(
     debounceTime(500),
     filter(formObj => {
     // code that remove empty object values
     })
).subscribe(val => {
  // val example `{fullName: "name", dateOfBirthday: "", phoneNumber: "", fullAddress: ""}`       
});

【问题讨论】：

参考这个可能对你有帮助：stackoverflow.com/questions/38521648/…
那么问题出在哪里？您可以使用 map() 代替 filter() 并将 formObj 更改为您需要的任何内容。

标签： angular rxjs angular-reactive-forms

【解决方案1】：

已创建 Stackblitz Demo 供您参考

你可以这样实现它：

filterEmptyFields(data: any): any {    // Filter any fields that aren't empty & store in a new object - To be passed on the Pipe map's caller
    let fields = {};
    Object.keys(data).forEach(key =>  data[key] != '' ? fields[key] = data[key] : key);

    return fields;   
}

trackEmptyFields(): void {
    this.form
      .valueChanges
      .pipe(map(this.filterEmptyFields))
      .subscribe(fields => console.log(fields));    
}

Stackblitz 的输出Demo

【讨论】：

或者你可以使用'Object.keys(data).forEach((key) => (!data[key]) && delete data[key]);'如果您的值可以为空、“null”或“未定义”