如何使用带有Angular的router.navigate传递和接收数据?

时间:2017-05-09 03:10:42

标签: angular angular2-routing

我正在尝试使用Angular .fixed-div{ position : fixed; top: 0; right: 0; }

传递和读取数据

我有一个组件

Route.navigate

在仪表板组件上我有

this._router.navigate(["dashboard",{ queryParams: { page: 1 }}],

但这总是返回 0

我做错了吗?

我的ngOnInit() { this.sub = this._route .queryParams .subscribe(params => { // Defaults to 0 if no query param provided. let page = +params['page'] || 0; console.log(page); }); }

ng --version

4 个答案:

答案 0 :(得分:2)

// Multidimensional int[][] array = new int[m][n]; // Not multidimensional ArrayList<ArrayList<Integer>> seq = new ArrayList<ArrayList<Integer>>(); 应该是queryParams的第二个参数。

替换此行

navigate

this._router.navigate(["dashboard",{ queryParams: { page: 1 }}];

答案 1 :(得分:1)

试试这个: -

public ActionResult SignIn()
{
    if (!Request.IsAuthenticated)
    {
        var authenticationManager = HttpContext.GetOwinContext().Authentication;
        authenticationManager.Challenge(new AuthenticationProperties() { RedirectUri = "/" }, Startup.SignInPolicyId); 
        return Content("");
    }
    else
    {
        return Redirect("~/Home/Login");
    } 
}

答案 2 :(得分:1)

试试这个

{ path: 'a4/:message', component:  Angular4Component, data:{ ping:'passedvia router'}}

使用this.message = this.route.snapshot.params['message'];

在组件中获取它

这是在repo中使用它的文件。

https://github.com/rahulrsingh09/AngularConcepts/blob/master/src/app/angular4/angular4.component.ts

相同的工作示例 - https://rahulrsingh09.github.io/AngularConcepts

答案 3 :(得分:0)

Angular 7.2.0引入了在路由的组件之间导航时传递数据的新方法,而数据不是查询字符串的一部分。

发送数据

df1 <- structure(list(X = c("Gene1", "Gene2", "Gene3", "Gene4", "Gene5", 
"Gene6"), CB_1.1 = c(10L, 871L, 490L, 17L, 75L, 308L), CB_10.1 = c(0L, 
7L, 2L, 5L, 1L, 2L), CB_10.2 = c(0L, 9L, 5L, 6L, 1L, 6L), CB_10.3 = c(0L, 
2L, 8L, 1L, 1L, 2L)), row.names = c(NA, 6L), class = "data.frame")

df2 <- structure(list(tissue_subcluster = c("CB_1.1", "CB_10.1", "CB_10.2", 
"CB_10.3", "CB_11.1", "CB_11.2"), Class_2 = c("Neuron", "Neuron", 
"Non-Neuron", "Non-Neuron", "Non-Neuron", "Non-Neuron")), row.names = c("1", 
"2", "3", "4", "5", "6"), class = "data.frame")

接收数据

您可以在构造函数中从浏览器的历史记录对象读取数据:

export class ComponentA {
    constructor(private router: Router) {}
    goToComponentB(): void {
        this.router.navigate(['routePath'], {state: {data: {...}}});
    }
}

参考-https://medium.com/ableneo/how-to-pass-data-between-routed-components-in-angular-2306308d8255