Question

我有一个组件，它是一个按钮，并将对象存储在名为“麦克风”的变量中。我希望按钮将对象传递给另一个组件，然后显示该特定对象的详细信息。但这对我不起作用。

假设在我的路线中，我定义了表示组件具有一个参数，该参数是我从[routerLink]行中的按钮传递过来的。但是在控制台中，我觉得该参数是未定义的。

button-menu.component.ts

export class ButtonMenuComponent implements OnInit {

  @Input()Microfonos:any;
  @Input()NombreClasificacion:any;

  micObj:any

  constructor() {

  }

  ngOnInit() { }

}

button-menu.component.html

<div class="btn-group dropright">
    <button type="button" class="btn beige dropdown-toggle" data-toggle="dropdown" data-display="static" aria-haspopup="true" aria-expanded="false">{{NombreClasificacion}}</button>
    <div class="dropdown-menu dropdown-menu-lg-left">
        <button *ngFor="let mics of Microfonos" class="dropdown-item beige text-center" type="button" [routerLink]="['/presentacion',mics]">{{mics.nombre}}</button>
    </div>
</div>

app-routing-module.ts

const routes: Routes = [
  {
  path:'menu',
  component: MainComponent,
  },
  {
    path:'bajo',
    component: MenuBajoComponent
  },
  {
    path:'guitarra',
    component: MenuGuitarraComponent
  },
  {
    path:'presentacion/:objMic',
    component:PresentacionMicComponent
  }
];

export class PresentacionMicComponent implements OnInit {

  objMic:any;

  constructor(private rutaActiva:ActivatedRoute) { 
    this.rutaActiva.params.subscribe( params => {
      this.objMic = params['mics'];
    });
    console.log(this.objMic);
  }

  ngOnInit() {

  }

}

Answer 1

首先@AlexanderStaroselsky是正确的console.log应该在subscription

，而您的button-menu.component.html也是错误的，如果麦克风是对象，则应使用麦克风的属性，而不是传递整个对象

此

import java.util.*;
import java.io.*;
public class Solution {
  public static void main(String[] args) {
    Scanner in = new Scanner(new BufferedReader(new InputStreamReader(System.in)));
    int t = in.nextInt(); // Scanner has functions to read ints, longs, strings, chars, etc.
    for (int i = 1; i <= t; ++i) {
      int n = in.nextInt();
      int m = in.nextInt();
      System.out.println("Case #" + i + ": " + (n + m) + " " + (n * m));
    }
  }
}

Answer 2

尝试以下代码：

let navigationExtras: NavigationExtras = {
            queryParams: {
                "par1": parVal1,
                "par2": parVal2,
                "par3": parVal3

            }
        };

this.router.navigate(['/componentName'], navigationExtras)

带参数Angular 6的路线

2 个答案: