javascript - knockoutjs 调用不断执行，我怎样才能只调用一次？

Question

我有这段代码:

t._teacherOptions = ko.observable();

function getTeacherList() {
  $.ajax({
    type: "POST",
    url: "/webservices/Service.asmx/GetTeachers",
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: function(i) {
      if (i.d) {
        console.log(i.d);
        return t._teacherOptions(i.d);

      }
    },
    error: function(n) {
      u(n);
    }
  });
}

t.TeacherOptions = ko.computed(function() {
  getTeacherList();
  return t._teacherOptions();
});

然后是我的 html:

<select data-bind="options: $root.TeacherOptions(), value: Id, optionsText: 'Name'"></select>

由于某种原因，打开页面后，获取教师名单的函数一直循环不停。

我能够得到我需要的结果，但循环仍在继续，我需要停止它。我在这里做错了什么吗？

Answer 1

您正在无休止地循环，因为您的 TeacherOptions (这是一个 计算)访问 _teacherOptions (因此创建了依赖项)并且因为您'在 Ajax 调用的 success 回调中重新改变 _teacherOptions 的值，TeacherOptions 将再次被评估(因为它依赖于 _teacherOptions)并再次发出 Ajax 请求。

尝试在计算之外调用getTeacherList():

t._teacherOptions = ko.observable();

function getTeacherList() {
  $.ajax({
    type: "POST",
    url: "/webservices/Service.asmx/GetTeachers",
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: function(i) {
      if (i.d) {
        console.log(i.d);
        return t._teacherOptions(i.d);

      }
    },
    error: function(n) {
      u(n);
    }
  });
}

getTeacherList();

t.TeacherOptions = ko.computed(function() {
  return t._teacherOptions();
});

参见Documentation