Javascript 在Angular中使用rxjs的双向数据绑定
我有一个角度模板和组件，我已经从角度材料的调整 我想使用事件和双向数据绑定操作卡上的一些属性。乍一看，双向数据绑定似乎很有效，因为我可以使用指令操作卡中给定索引的editorContent属性，这些更改反映在我添加到视图中进行调试的一个简单的标记中。但是，这似乎并没有实际更新组件中的cards对象 我已经读过，要操纵可观测数据，你必须先订阅它们。clearEditor方法成功地从卡片中获取了数据，但是contentEditor没有从视图中更新，如果我在构造函数中将其设置为非空或非空的字符串，那么在方法中将其设置为null似乎也不会改变卡片的值 进口{ 组成部分 }从@angular/core开始； 进口{ 地图 }来自rxjs/运营商； 进口{ 断点， 断点观察者 }从@angular/cdk/布局开始； 进口{ 可观察 }来自‘rxjs’； @组成部分{ 选择器：app repl， templateUrl:./repl.component.html， 样式URL:[./repl.component.scss] } 导出类组件{ 卡片：可见Javascript 在Angular中使用rxjs的双向数据绑定,javascript,angular,rxjs,angular-material,Javascript,Angular,Rxjs,Angular Material,我有一个角度模板和组件，我已经从角度材料的调整 我想使用事件和双向数据绑定操作卡上的一些属性。乍一看，双向数据绑定似乎很有效，因为我可以使用指令操作卡中给定索引的editorContent属性，这些更改反映在我添加到视图中进行调试的一个简单的标记中。但是，这似乎并没有实际更新组件中的cards对象 我已经读过，要操纵可观测数据，你必须先订阅它们。clearEditor方法成功地从卡片中获取了数据，但是contentEditor没有从视图中更新，如果我在构造函数中将其设置为非空或非空的字符串，那么
订阅Observable不允许您操作Observable中的数据。将可观测视为一个事件流。通过订阅它们，您只能阅读该流中的内容。根据场景的不同，有不同的方法来处理将数据放入流中的问题。下面是一个片段，希望能帮助您处理您的场景：
import { Subject } from 'rxjs';
import { map, switchMap, startWith } from 'rxjs/operators'
private language = new Subject<string>();
cards = this.breakpointObserver.observe(Breakpoints.Handset).pipe(
map(breakpoint => {
/* content of the map operator that you showed in your question */
return cards;
}),
switchMap(cards => {
return this.language.pipe(
map(language => {
const card = cards.find(c => c.language === language);
card.editorContent = null;
return cards;
}),
// when the outter breakpoint Observable emits, we just
// want to emit the cards as is.
startWith(cards)
})
)
);
clearEditor(language: string) {
this.language.next(language);
}
是一个运算符，用于将语言主题和可观察断点转换为单个可观察卡片。现在，每当在语言主题上调用next时，可观察的卡片将发出更新的卡片。下面的代码就是我们最终采用的方法： 导出类REPLComponent实现OnInit{ 列：编号=2； 卡片：阵列
}在AfterContentInitI钩子中调用代码。