设置可观察对象时,防止敲除调用预订

辛德雷

我有两个输入绑定到它们自己的可观察值。两者都具有启动ajax调用的订阅功能。还有一些其他字段将从ajax结果中填写。我希望能够在键入companyName时获取数据。我还想在输入cardNumber时获得companyName(以及更多),但是给companyName一个值将触发其subscibe函数,该函数将启动另一个ajax调用。我想防止这种情况的发生。

cardNumber = ko.observable();
companyName = ko.observable();

cardNumber.subscribe(function () {
        getDataFromCardNumber(cardNumber());
});
companyName.subscribe(function () {
        getDataFromCompanyName(companyName());
});

getDataFromCardNumber = function (cardNr) {
    $.ajax({
        type: 'GET',
        data: { number: cardNr },
        url: '/Home/GetCardInfo',
        success: function (data) {
           companyName(data.Company.CompanyName);
           //some other fields
        }
    });
};
//getDataFromCompanyName(name) contains another ajax call to fill out some other fields aswell
用户名

我看到两个选择:

  • 您可以dispose在从回调中写入之前进行预订,然后在设置新值时重新附加它。

const obsA = ko.observable("a");
const obsB = ko.observable("b");

const updateA = newVal => setTimeout(
  () => {
    subA.dispose();
    obsA("reset by B");
    subA = obsA.subscribe(updateB);
  }, 500);
  
const updateB = newVal => setTimeout(
  () => {
    subB.dispose();
    obsB("reset by A");
    subB = obsB.subscribe(updateA);
  }, 500);


let subA = obsA.subscribe(updateB);
let subB = obsB.subscribe(updateA);

  
ko.applyBindings({ obsA, obsB });
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script>
A: <input data-bind="value: obsA" />
B: <input data-bind="value: obsB" />

  • 您可以创建单独的UI可观察对象,以其write逻辑调用更新

const obsA = ko.observable("a");
const obsB = ko.observable("b");

const uiObsA = ko.computed({
  read: obsA,
  write: val => {
    obsA(val);
    updateB();
  }
});

const uiObsB = ko.computed({
  read: obsB,
  write: val => {
    obsB(val);
    updateA();
  }
});

const updateB = newVal => setTimeout(
  () => obsB("reset by A"), 500);
  
const updateA = newVal => setTimeout(
  () => obsA("reset by B"), 500);
  
ko.applyBindings({ obsA, obsB });
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script>
A: <input data-bind="value: uiObsA" />
B: <input data-bind="value: uiObsB" />

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

使用可观察对象时如何防止Angular 2中的http调用?

使用 api 调用设置可观察对象的属性

具有可观察对象的敲除组件不会更新数据

预订两个可观察对象,即在另一个可观察的HTTP内部观察

Knockout.js-防止更改事件绑定通过可观察值设置值时触发

如何设置可观察对象观看财产?

如何防止从 Angular 可观察订阅触发的 API 调用重叠?

来自可观察来源的“预订”值

敲除计算的可观察写入不更新

显示敲除可观察数组的内容

无法绑定可观察数组-敲除

敲除的可观察数组排序问题

如何基于先前的结果构建可调用多个可观察对象的可观察对象?

从另一个可观察对象调用可观察对象

绑定为可观察到的敲除时如何更新ckeditor数据?

RxJS:仅当订阅了外部可观察对象时,才如何订阅内部可观察对象?

可观察数组的可观察对象?

Angular 8-依次调用可观察对象

模拟服务调用返回Angular 2中的可观察对象?

带有可观察对象的角度同步调用

动态可观察对象

如何根据可观察对象设置角垫按钮属性?

如何设置新状态来测试可观察对象?

防止可观察的多次执行

当可观察的时间更长时,不调用switchMap的订阅

嵌套可观察项完成时,Angular 10调用finalize()

映射可观察对象时出现 Angular/RxJS 类型错误

链接可观察对象时正确推断类型

合并两个可观察对象时保留排序