Question

选中复选框网址时，需要使用角度4像这样http://localhost:4200/en/offers?location=east&location=west进行更新。

我将其用于仅单个值更新：

this.router.navigate([], { relativeTo: this.route, queryParams: { location: 'ss', } });

我的代码：

onLocationChange() {

    const filteredData = [];
    const filteredLocationName = [];
    let lastItem;
    let allSameResult = true;
    this.locationGrp.value.location.map((s, i) => {
        if (typeof lastItem !== "undefined" && lastItem !== s) {
            allSameResult = false;
        }
        if (s) {
            filteredData.push(this.coordinates[i].id);
            filteredLocationName.push(this.coordinates[i].languages[this.currentLang].name);
        }
        lastItem = s;
    });
    if (!allSameResult) {
        this.locationGrp.get('all').enable();
        this.locationGrp.get('all').patchValue(false);
        // if all true or all false no need to update filter
        this.locationFilterData = filteredData;
        this.lastLocationFilterData = filteredData;
        this.locationFilterSlug = filteredLocationName;
        this.router.navigate([], {
            relativeTo: this.route,
            queryParams: {
                location: 'ss',
            }
        });
    } else {
        this.locationGrp.get('all').patchValue(true);
        this.locationFilterData = [];
        this.lastLocationFilterData = [];
        this.locationFilterSlug = [];
    }
    this.locationFilterUpdate = !this.locationFilterUpdate;
    // for first tim change reverse
    if (!this.allLocationInitial) {
        if (!allSameResult) {
            this.allLocationFilter = false;
            /* this.allLocationFilterDisable = false;*/
        } else {
            this.allLocationFilter = true;
        }
    } else {
        this.allLocationFilter = true;
        this.allLocationInitial = false;
    }


}

Answer 1

您的示例出现问题，您说：

http://localhost:4200/en/offers?location=east&location=west

在这种情况下，您两次在不同的值上使用 location ，因此应在查询参数中使用数组，如下所示：

http://localhost:4200/en/offers?location=east,west

要实现这样的事情，您只需要将代码更改为这样的事情：

this.router.navigate([], { relativeTo: this.route, queryParams: { location: ['east', 'west']} });

如果有任何问题，请在下面评论。

更新查询参数复选框过滤器角度4

1 个答案: