首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >如何在角度2中将物体从一个组件传递到另一个组件?

如何在角度2中将物体从一个组件传递到另一个组件?
EN

Stack Overflow用户
提问于 2015-12-04 12:15:20
回答 4查看 278.9K关注 0票数 82

我有角分量,第一个分量使用第二个作为指令。它们应该共享相同的模型对象,该模型在第一个组件中初始化。如何将该模型传递给第二个组件?

EN

回答 4

Stack Overflow用户

回答已采纳

发布于 2015-12-04 12:27:13

组件2,指令组件可以定义一个输入属性(类型记录中的@input注释)。组件1可以从模板将该属性传递给指令组件。

看到这个,所以回答如何在Angular2中实现主组件和细节组件之间的通信?

以及如何将输入传递给子组件。在您的情况下,这是指令。

票数 25
EN

Stack Overflow用户

发布于 2017-04-05 07:18:15

您还可以使用setter将数据存储在服务中,并通过getter获取数据。

代码语言:javascript
运行
复制
import { Injectable } from '@angular/core';

@Injectable()
export class StorageService {

    public scope: Array<any> | boolean = false;

    constructor() {
    }

    public getScope(): Array<any> | boolean {
        return this.scope;
    }

    public setScope(scope: any): void {
        this.scope = scope;
    }
}
票数 18
EN

Stack Overflow用户

发布于 2019-06-26 07:18:13

从组分

代码语言:javascript
运行
复制
import { Component, OnInit, ViewChild} from '@angular/core';
    import { HttpClient } from '@angular/common/http';
    import { dataService } from "src/app/service/data.service";
    @Component( {
        selector: 'app-sideWidget',
        templateUrl: './sideWidget.html',
        styleUrls: ['./linked-widget.component.css']
    } )
    export class sideWidget{
    TableColumnNames: object[];
    SelectedtableName: string = "patient";
    constructor( private LWTableColumnNames: dataService ) { 
       
    }
    
    ngOnInit() {
        this.http.post( 'getColumns', this.SelectedtableName )
            .subscribe(
            ( data: object[] ) => {
                this.TableColumnNames = data;
     this.LWTableColumnNames.refLWTableColumnNames = this.TableColumnNames; //this line of code will pass the value through data service
            } );
    
    }    
    }

DataService

代码语言:javascript
运行
复制
import { Injectable } from '@angular/core';
import { BehaviorSubject, Observable } from 'rxjs';

@Injectable()
export class dataService {
    refLWTableColumnNames: object;//creating an object for the data
}

转到组件

代码语言:javascript
运行
复制
import { Component, OnInit } from '@angular/core';
import { dataService } from "src/app/service/data.service";

@Component( {
    selector: 'app-linked-widget',
    templateUrl: './linked-widget.component.html',
    styleUrls: ['./linked-widget.component.css']
} )
export class LinkedWidgetComponent implements OnInit {

    constructor(private LWTableColumnNames: dataService) { }

    ngOnInit() {
    console.log(this.LWTableColumnNames.refLWTableColumnNames);
    }
    createTable(){
        console.log(this.LWTableColumnNames.refLWTableColumnNames);// calling the object from another component
    }

}

票数 3
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/34088209

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档