如何定义queryParams Angular 5路由器

时间:2018-05-08 09:55:10

标签: angular angular-router

我遇到查询参数问题。每个路由器都有一些不同的queryParams。

$ stateProvider允许在$ state

中定义queryParams
this.activatedRoute.queryParams.subscribe(params => {

});

此代码允许从queryParams获取test1和test2字段。

关于新的Angular路由器,如果我需要查看queryParams,我应该订阅

func pickerView(_ pickerView: UIPickerView, didSelectRow row: Int, inComponent component: Int) {

    if pickerView == coursesPicker {

        coursesTextField.text = GetCourses.instance.getCoursesInstance[row].courseName
        countryId = GetCourses.instance.getCoursesInstance[row].id
        self.callSectioApi(id: countryId)

        //Reload sectionPicker
        self.sectionsPicker.reloadAllComponents()
        self.sectionsPicker.selectRow(0, inComponent: 0, animated: false)

        self.coursesPicker.isHidden = true

    } else {

        sectionTextField.text =  GetSectionService.sectionsServiceinstance.sectionModelInstance[row].sectionName
        self.sectionsPicker.isHidden = true

    }
    self.view.endEditing(true)
}

这段代码有问题,如果我输入url某些第三方test3 = lol,我会在参数参数中得到这个参数,我不想在所有地方过滤它

如何在Angular 5路由器中设置'/ test?test1& test2'

1 个答案:

答案 0 :(得分:1)

goProducts() {
  this.router.navigate(['/products'], { queryParams: { order: 'popular', 'price-range': 'not-cheap' } });
}

网址就是这样。

http://localhost:4200/products?order=popular&price-range=not-cheap

在组件构造函数中

this.activatedRoute.queryParams.subscribe(params => {

});

希望这会有所帮助。使用this来回答您的问题。