相关疑难解决方法(0)

Angular 2:将数据传递给路由?

我正在研究这个angular2项目,我用它ROUTER_DIRECTIVES来从一个组件导航到另一个组件.

有2个组件.即PagesComponent&DesignerComponent.

我想从PagesComponent导航到DesignerComponent.

到目前为止它的路由正确但我需要传递pageObject,因此设计人员可以加载该页面对象本身.

我尝试使用RouteParams但它获取页面对象undefined.

下面是我的代码:

pages.component.ts

import {Component, OnInit ,Input} from 'angular2/core';
import { GlobalObjectsService} from './../../shared/services/global/global.objects.service';
import { ROUTER_DIRECTIVES, RouteConfig } from 'angular2/router';
import { DesignerComponent } from './../../designer/designer.component';
import {RouteParams} from 'angular2/router';

@Component({
    selector: 'pages',    
    directives:[ROUTER_DIRECTIVES,],
    templateUrl: 'app/project-manager/pages/pages.component.html'
})
@RouteConfig([
  { path: '/',name: 'Designer',component: DesignerComponent }      
])

export class PagesComponent implements OnInit {
@Input() pages:any;
public selectedWorkspace:any;    
constructor(private globalObjectsService:GlobalObjectsService) {
    this.selectedWorkspace=this.globalObjectsService.selectedWorkspace;                    
}
ngOnInit() { }   
}
Run Code Online (Sandbox Code Playgroud)

在html中,我正在做以下事情: …

javascript typescript angular2-routing angular

35
推荐指数
2
解决办法
11万
查看次数

Angular4:如何通过路由器添加的子节点将数据从父节点传递给子节点

继续这个问题Angular 4 ^:如何让一个组件的多个子组件与每个子组件定位其自己的路由器插座,我可以将一些子组件注入多个父组件,现在我想从那些组件中传递数据父母,异步,对孩子.试过@Input,似乎无法获胜.

儿童

export class UserheaderComponent implements OnInit, AfterViewInit, OnChanges {
  loading;
  @Input() data;
  user = {
    name: '______________',
    icon: '',
    username: '_________',
    uid: '________'
  };
  constructor(private router: Router) {
  }

  goToUser(uid) {
    this.router.navigate(['user'], { queryParams: { uid: uid } });
  }

  ngOnInit() {
    this.user = this.data;
    console.log(this.data);
  }

  ngAfterViewInit() {
    console.log(this.data);
  }

  ngOnChanges(changes: SimpleChanges) {
    console.log(changes);
  }
}
Run Code Online (Sandbox Code Playgroud)

家长Html

  <router-outlet name='userprofile-userhead' [data]="currentUser"></router-outlet>
Run Code Online (Sandbox Code Playgroud)

家长TS

export class UserprofileComponent {
  public currentUser;

  constructor(
    private userFactory: UserFactory,
    private router: Router, …
Run Code Online (Sandbox Code Playgroud)

typescript angular

8
推荐指数
1
解决办法
2257
查看次数