Question

我想从项目列表中获取一个项目，并在另一个组件中使用该对象。我不知道该怎么做。以下是我的HTML代码。

    setProjectId(project){
    this.authService.setProjectId(project._id);
}

更新：我可能会尝试使用服务来执行此操作。

    setProjectId(id){
    this.project_id = id;
  }



getProjectId(){
    return this.project_id;
  }

单击时将对象发送到服务。

    ngOnInit() {
    this.authService.getProjectId().subscribe(data => {
      this.project_id = data;
    },
    err =>{
      console.log(err);
      return false;
    });
  }

并使用ngInit（）

获取其他组件中的id

<a class="button" href="../YourServletUrl?price=<%=resultSet.getString("price") %>"><span>Add to WishList</span></a>

Answer 1

就像您在project中使用getAllTasks()变量一样，您可以在要使用该对象的组件上设置输入，并将project变量绑定到该输入属性。

Answer 2

你可以按如下方式实现：

<li *ngFor = "let project of projects" class="list-group-item" (click)="emitObject(project)">{{project.name}} {{project._id}}></li>

现在在您的ts文件中，您可以像这样定义一个新的事件发射器：

@Output()
selectedProject = new EventEmitter<any>;

emitObject(project) {
    this.selectedProject.emit(project);
}

这将发出一个事件，您可以在html中收听，然后执行业务逻辑。

如果您碰巧在此组件的html中使用该组件，您也可以将其作为输入属性传递给组件。

祝你好运！

Answer 3

根据您的评论...

此组件只显示项目，因此当我单击特定项目上的链接以创建任务时，我希望重新路由到该组件并使用该特定project_id创建任务

...我认为最干净的解决方案是在您的路线中添加查询参数：

路线片段：{path: 'newTask/:id', component: NewTaskComponent }

在NewTaskComponent中，您可以获得以下ID：

constructor(private activatedRoute: ActivatedRoute,
            private taskService: TaskService) {
  activatedRoute.params.subscribe(
    params => {
      if (params['id'] != undefined) {
        taskService.getTaskById(params['id']).subscribe(
          result => console.log(result),
          error => console.log(error)
        );
      }
    }
}

这将要求您创建一个可以通过id获取任务的taskService。

如何从Angular2中的HTML获取对象

3 个答案: