Question

我有一个读取组件和一个编辑组件。读取组件显示对象（Employee）的所有属性，然后单击编辑按钮时，它将重新路由到另一个组件的单独页面。目标是使属性值显示在可以编辑的文本框中

在读取组件中，“编辑”按钮具有此单击

时调用的方法

Not (onfirstrecord)

Using this example我理解如何传递一个字符串，但我希望传递整个对象。 Also have read this但我不明白如何修改它以使用导航更改。我不打算通过查询参数传递这个

修改：我已更新我的代码以使用共享服务。但是，在子（编辑）组件中，Employee未定义。我想也许我正在清理服务中的数据，这就是为什么它是空的（？）但不知道我在做什么呢

父

toggleEditMode() {
    this.router.navigate('/editPage')
}

儿童

@Component({
    providers: [EmployeesService]
})
export class EmployeeParentComponent {
    private employee: Employee;

    constructor(
        private employeesService: EmployeesService,
        protected router: Router,
        protected route: ActivatedRoute,) { }

    ngOnInit(): void {

    }

    toggleEditMode(employee: Employee) {
        this.employeesService.employee = employee;
        alert(this.employeesService.employee.firstName); //correct name
        this.router.navigate('/editPage')
    }
}

服务

@Component({
    providers: []
})

export class EditEmployeeComponent {
    constructor(
        private employeesService: EmployeesService
        ) {
        console.info(employeesService.employee); //undefined
    }

    ngOnInit(): void {
        console.info(this.employeesService.employee); //undefined
    }
}

如何将对象传递给Angular 2中的组件？

0 个答案: