在Angular 7中的组件之间传递值
可以通过以下几种方式实现：
- 使用@Input和@Output装饰器：通过@Input装饰器将父组件的属性传递给子组件，子组件可以通过该属性接收父组件传递的值。而通过@Output装饰器和EventEmitter可以在子组件中触发事件，并将值传递给父组件。
- 使用服务（Service）：可以创建一个共享的服务，通过该服务在组件之间共享数据。在提供该服务时，可以将其注入到需要共享数据的组件中，然后通过该服务的方法或属性来传递值。
- 使用路由参数：可以通过路由参数将值传递给目标组件。在定义路由时，可以在路由路径中定义参数，然后在组件中通过ActivatedRoute服务来获取参数的值。
- 使用路由查询参数：类似于路由参数，但是通过查询参数的方式传递值。可以在路由路径中定义查询参数，然后在组件中通过ActivatedRoute服务来获取查询参数的值。
- 使用模板引用变量：可以在父组件的模板中使用模板引用变量来获取子组件的实例，然后通过该实例的属性或方法来传递值。
- 使用RxJS的Subject或BehaviorSubject：可以创建一个Subject或BehaviorSubject对象，将其作为一个可观察对象，在组件之间进行订阅和发布值。
以上是在Angular 7中组件之间传递值的几种常见方式。根据具体的场景和需求，选择合适的方式来实现组件之间的数据传递。
腾讯云相关产品和产品介绍链接地址：
- 腾讯云官网：https://cloud.tencent.com/
- 云服务器（CVM）：https://cloud.tencent.com/product/cvm
- 云数据库 MySQL 版：https://cloud.tencent.com/product/cdb_mysql
- 云原生应用引擎（TKE）：https://cloud.tencent.com/product/tke
- 人工智能平台（AI Lab）：https://cloud.tencent.com/product/ai
- 物联网开发平台（IoT Explorer）：https://cloud.tencent.com/product/iotexplorer
- 移动推送服务（信鸽）：https://cloud.tencent.com/product/tpns
- 对象存储（COS）：https://cloud.tencent.com/product/cos
- 腾讯区块链服务（TBaaS）：https://cloud.tencent.com/product/tbaas
- 腾讯云游戏引擎（GSE）：https://cloud.tencent.com/product/gse
相关·内容
所以我有两个组件--就它们在组件层次结构中的位置而言，一个就像另一个组件的第三个移除的祖父母--我希望在它们之间传递数据。，并在它们试图传递数据时调用change函数。不过，Angular2似乎不喜欢这种情况，只是忽略了通过订阅获得的任何内容。我的控制台记录了订阅，它们被“订阅”并打开。我可以通过调用组件本身并使用jQuery或
浏览 2提问于2017-04-09得票数 0
回答已采纳
一旦从Service的http调用中返回了值，我就想调用另一个html来显示接收到的结果(它存在于我设计的另一个组件中)。我想将收到的结果存储在一个模型中，然后通过提取模型属性来显示第二个页面，但我似乎无法让它工作。this.weatherCardEventEmitter.emit(data);//trying to emit it to card component我试图从上面的组件中获取值的</em
浏览 17提问于2019-11-06得票数 1
使用Angular6时，假设我有两个子组件A、B，它们都是父组件P的一部分。我希望在组件A上使用表单输入-所以一旦单击，字符串值将传递并在组件B上触发一个函数：这有可能吗我已经使用EventEmitter成功地在组件之间传输了数据，但是是否有可能用这些
浏览 1提问于2018-09-19得票数 5
回答已采纳
我试图更好地理解在角2中的组件和服务之间传递值。我的main.serviceimport { Subject } from 'rxjs/Subject';
@并由我的组件订阅。现在，我希望通过textSource在组件和服务
浏览 4提问于2016-10-31得票数 0
回答已采纳
我正在升级一个大型的Angular 1.6应用程序，我们有许多组件使用'require‘来访问父组件的控制器。AngularJS组件如下所示： template: '<ignore>', require: {
formsCtrl: '^gsForm&#x
浏览 3提问于2018-11-30得票数 2
1回答
为了在angular2不同组件之间传递值，我使用注入到不同组件中的不同服务。import { ApiService } from '..&#
浏览 4提问于2016-08-12得票数 0
回答已采纳
我刚接触angular2，我想学习一件简单的事情，那就是如何在两个组件之间交换数据，我得到了一种在父组件和子组件之间交换数据的方法，但我尝试的是在我的应用程序组件中，我将它路由到不同的组件，所以我如何传递数据我想要做的是:在我的应用程序组件
浏览 0提问于2017-11-09得票数 0
2回答
我用的是安古拉2号流星。当我试图在两个组件之间传递一个值时(当第一个组件中的值发生变化时，在第二个组件中创建一个事件并使用这个新值)，我现在有两种方法：
哪条路应该优先？或者
浏览 5提问于2016-01-31得票数 0
回答已采纳
2回答
角2触发分量法
、、
我在两个组件(one.component和two.component)之间有一个关系，在两个组件之间有一个服务(global.service)。一切都运行得很好(我可以将值从一个传递到另一个，就像中的值从Angular.io站点传递)。我在global.service中有一个全局变量，从one.component中删除，当这种情况发生时，我需要在two.compo
浏览 5提问于2017-05-12得票数 0
moveBack() { }现在，当我调用moveFront()函数时，componentB被调用了，但是我还想传递一些数据给组件我的两个组件都是子组件，我希望在一个子组件与另一个子组件之间来回传输数据。我该怎么做呢。
浏览 3提问于2017-08-16得票数 1
我想用来自另一个组件的angular2标记将html注入到我的a组件中。; 我想看看结果:它的工作！(从variableFromAComponent)但是我看到{{variableFromAComponent}} (angular2标记不起作用)。
浏览 3提问于2017-01-05得票数 2
回答已采纳
3回答
我是angular 2+的新手，我想实现组件之间的双向数据绑定，我需要的是只传递一个变量的值，这样创建服务就不会是一个好的选择，寻找相同的替代方案。
浏览 1提问于2017-11-22得票数 0
我有一个简单的应用程序，其中有一个主组件和一个子组件。主组件接受子组件将要使用的数据值。</my-app>@Component({ providers: [], }在主组件的
浏览 1提问于2016-02-09得票数 3
回答已采纳
事情是这样的。我有两个需要交换数据的组件。让我们假设组件1和组件2。, objectCol1, objectCol2);我正在使用Provider与组件进行通信。在组件2中，我有以下内容：
import {Component1} from '...
浏览 2提问于2017-03-21得票数 0
我在父组件中有以下模板： <my-table (loaded)="onTableLoaded()" [objId]="objId"></my-table> 我遇到的问题是，在加载子组件时，objId为空我可以在子级中添加api调用，但我不想这样做。你知道如何让父进程中的api调用的值转移到子进程中吗？
浏览 15提问于2019-05-28得票数 1
1回答
var app = angular.module('addApp', []);
app.controller('addController', ['$scope', function ($scope)我想进一步写一个使用角2的应用程序，所以我想在角分量内使用输入数字。
浏览 5提问于2016-01-22得票数 1
回答已采纳
我正在尝试添加一个仪表板组件，并尝试将用户详细信息传递给它。我在dashboard.component.ts user: User中声明，它有自己的模型，在ng中声明为： this.user= data['user'];现在，当我以{{user.firstName}}的身份在html中调用时，会得到以下错误
ERROR TypeError: C
浏览 2提问于2020-03-31得票数 0
我试图创建一个自定义按钮组件，并且基于一个属性，我需要添加一个特定的类，例如：需要在这个组件中添加这个类： background-color: green;我在找关于我如何制作这个的任何想法或教程
浏览 3提问于2020-08-01得票数 1
回答已采纳
我不确定如何设置我的服务和同级组件来传递formcontrol值。我需要在组件之间传递某些值，因为我需要根据表单中的值形成一个字符串。componentB有以下字段:等级、州、计划我正在使用Angular 8和Material。我知道我需要使用我的dataservice.ts创建一个同级
浏览 10提问于2019-10-29得票数 0
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
实时音视频
云直播活动推荐
腾讯云开发者
