Question

我正在调用API。 API返回结果列表。当它这样做时 - 响应被送入一个对象，然后我用它来迭代并显示它们。

这是执行该操作的功能：

    var getAvailability = () => {
        if (chosenData.hotel == "") {
            showError("Please select a location before booking.");
            $timeout(() => LTBNavService.setTab('location'), 50);
            return;
        }

        searchResponse = {};
        console.log(searchResponse);
        WebAPI.getHotelAvailability(genSearchObject()).then((data) => {
            searchResponse = data;
            $timeout(() => $('[data-tab-content] .search-btn').first().focus(), 50);
            generateRoomTypeObject(searchResponse);
        }, (data) => searchResponse.error = data.data.errors[0].error);

    };

问题：在新的结果集可用之前，旧结果仍会显示。这会导致闪烁和延迟，这是一种糟糕的用户体验。

解决方案:(我需要帮助）处理此问题的最佳方法是什么？理想情况下，我想重置/清除搜索响应。如同，新的结果被传递，旧的结果被清除。这可能来自getAvailability函数吗？

实现这一目标的最佳方式是什么？

Answer 1

解决方案：

感谢@Daniel Beck建议调用generateRoomTypeObject函数并将其提供给空对象 - + 1＆＃39; d评论。

这在我的generateRoomTypeObject函数中触发了一个未定义的错误，其中我正在运行一些长度检查（有意义，因为对象是空的 - 所以没有任何事情可以进行长度检查）。

我通过处理未定义的异常并将searchResponse设置为空对象来处理错误。

  var generateRoomTypeObject = (searchResponse) => {
    var ratePlans = searchResponse.ratePlans,
        errors = searchResponse.error,
        roomTypes = [],
        ignoreBiggerRooms = false;
    rawRoomsObjs = [];
    if (angular.isUndefined(errors)) {
        // Iterate over the rate plan
        if(ratePlans === undefined){   
            //generateRoomTypeObject -- Handle undefined by creating new object
            searchResponse =  {}
        }else{
              for (var i = 0; i < ratePlans.length; i++) {
            var ratePlan = ratePlans[i],
                rooms = ratePlan.rooms;
            // Iterate over the rooms and add rooms to room object. Also keep a list of room types.
            for (var j = 0; j < rooms.length; j++) {
                //Stuff here
            }
        }
    }
}

清除JS响应

1 个答案: