在组件或路由之间传递数据，angular4
在Angular 4中，在组件或路由之间传递数据可以通过以下几种方式实现：
- 使用@Input和@Output装饰器：通过在父组件中使用@Input装饰器将数据传递给子组件，在子组件中使用@Output装饰器将数据传递回父组件。这种方式适用于父子组件之间的数据传递。
- 使用服务（Service）：创建一个共享的服务，通过在组件中注入该服务来实现数据传递。组件可以通过服务的方法来获取或修改数据。这种方式适用于任意组件之间的数据传递。
- 使用路由参数：通过在路由配置中定义参数，可以在不同的路由之间传递数据。在源路由中使用路由参数传递数据，在目标路由中通过ActivatedRoute服务来获取传递的参数。
- 使用路由查询参数：通过在URL中添加查询参数来传递数据。在源路由中使用Router.navigate方法传递查询参数，在目标路由中通过ActivatedRoute服务来获取传递的查询参数。
- 使用本地存储（LocalStorage或SessionStorage）：将数据存储在浏览器的本地存储中，在不同的组件中通过读取或修改本地存储来实现数据传递。
- 使用RxJS的Subject或BehaviorSubject：创建一个Subject或BehaviorSubject对象，通过订阅和发布事件来传递数据。组件可以通过订阅该对象来获取传递的数据。
以上是在Angular 4中实现组件或路由之间传递数据的常用方式。具体使用哪种方式取决于具体的场景和需求。在腾讯云的产品中，可以使用腾讯云的云函数（SCF）来实现数据的处理和传递。云函数是一种无服务器的计算服务，可以帮助开发者在云端运行代码，实现数据的处理和传递。您可以通过腾讯云云函数的官方文档了解更多信息：腾讯云云函数。
相关·内容
2回答
如何避免在角度上的路径间共享数据时可观察到的痛苦？
angular、typescript、angular2-observables、angular-router
当我们希望在路由之间共享数据时，唯一可行的解决方案似乎是使用服务。由于我们希望在更新数据时在视图中重新添加数据，所以我们必须使用BehaviorSubject。
所以，如果我错了，请纠正我，但是一个简单的组件如下所示：
@Component({
selector: 'user-info',
template: `
{{($user | async).firstName}}
<button (click)="updateName()"></button>
`
})
export cla
浏览 0提问于2018-04-19得票数 3
回答已采纳
4回答
如何使用在安圭拉中使用状态传递的数据
javascript、html、angular
我试图在我的角应用程序中实现搜索，通过图书服务接收数据，并在导航到新组件时使用状态传递数据，数据以对象数组的形式存在。我在这里面临的挑战是如何使用新组件上的数据，下面的方法并没有给出所需的结果。
搜索输入
import {
Component,
OnInit
} from '@angular/core';
import {
BookService
} from '../services';
import {
Router
} from '@angular/router';
@Component({
selector: &
浏览 3提问于2019-12-20得票数 0
1回答
当将一个视图导航到具有HTTP请求高有效负载响应的另一个视图时，Request会被冻结
javascript、angular、angular-router
我有一个角度为9.1.11的应用程序，在从一个页面导航到另一个页面(加载延迟的不同模块)导航后会被冻结。
我的场景类似于：
我有一个操作按钮View Report，它导航到不同的路由，比如/reportData，它的查询参数附加于/reportData?reportId=XYZ&reportDate=YZX。
在我的ReportComponent中，我从ActivatedRoute获取queryParams，并使用调用HTTP的params
请求将以重有效负载作为响应响应，4-5 mb最小值为响应。
当我单击View Report页面冻结时，几秒钟后
浏览 3提问于2020-08-07得票数 1
2回答
角路由器将数据传递给组件
javascript、angular、typescript、refactoring、angular-routing
用角度路由器将数据传递给组件是一种良好的做法，还是应该使用服务？
目前，组件获取的数据如下：
this.account = activatedRoute.snapshot.data.account
浏览 2提问于2021-10-01得票数 0
回答已采纳
3回答
网络：私有网络是什么意思？可以直接上互联网吗？
私有网络、5折上云
[图片]
标题：腾讯云云产品新购特惠，五折上云！
地址：https://cloud.tencent.com/act/first_purchase?utm_source=portal&utm_medium=rightbanner&utm_campaign=firstpurchase&utm_term=0109&_ga=2.121460426.337043824.1519722173-1832914836.1510649862
浏览器信息
Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (K
浏览 5086提问于2018-02-28
2回答
如何使用可观察数据(声明模式)通过ID获取对象
angular、rxjs、observable、angular-router、declarative-programming
我试图使我的应用程序变得更被动/声明性比程序性更强&尝试不将参数传递给我的服务/从我的服务中传递参数非常困难。
我的网址是这样的：/settings/organizations/26ee00d1-9fd8-4e38-a195-024c11ae0958
// organization.component.ts
organizationId: string;
...
constructor(private readonly activatedRoute: ActivatedRoute) {
//...
}
ngOnInit(): void {
this.organi
浏览 11提问于2022-10-18得票数 1
回答已采纳
1回答
将游戏账号和QQ账号绑定后游戏服务器端如何校验用户？
官方文档、腾讯云帐号
请描述您的问题
标题：iOS SDK - 手游社交组件 - 文档首页 - 腾讯云文档平台 - 腾讯云
地址：https://cloud.tencent.com/document/product/630/11889
浏览 163提问于2018-03-19
4回答
如何通过angular4中的路由器链接从另一个页面传递和获取该值？
angular、login、angular4-router
我想使用routerLink传递一个带有URL的值，并在另一个页面上读取该值。就像我有模块和子模块一样。在选择第一条记录时，该记录的id将传递给用户页面。在读取该Userid之后，我希望显示该用户和模块/子模块的详细信息。
那么我如何传递和获取值(对象)呢？
Userdetails组件类：
import { Component, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
@Component({
selector: 'userde
浏览 2提问于2018-02-13得票数 0
1回答
如何通过非字符串对象之间的路由之间的角度？
angular、angular-routing、angular-router
我正在构建一个文件查看器。为此，我有一个名为FileBrowserComponent的组件，它在路由称为/files时显示。
我在导航时附加了一个查询参数，以显示目录的内容。因此，要打开特定的目录，我使用‘/file?location=c:/user/xyz/.’调用。
在组件内部，我订阅了ActivatedRoute.queryParam，这意味着每当组件处于活动状态时，当用户浏览到另一个位置时，我会得到通知，然后我可以显示文件和文件夹。
在一种情况下，我需要向URL传递一个可选的非字符串对象。但我只订阅queryParams对象，该对象将Params作为字符串提供给我。
当我导航到返回查询
浏览 1提问于2021-11-13得票数 0
回答已采纳
1回答
在服务中实现的接口不起作用？
angular
我有一个主题，其中有接口，解析是在服务文件中实现的，它运行良好。我正在做同样的方法，但是接口不工作。我的意思是，当我在ts文件中初始化它时，我需要服务中的products数组，它的数组中有来自api的数据，用于获取所有的公司。
这是我的ts代码：
export class CompanyComponent implements OnInit {
dataSource: FilesDataSource | null;
displayedColumns = ['id', 'name'];
@ViewChild(MatPagina
浏览 1提问于2018-10-09得票数 0
回答已采纳
5回答
如何使用BehaviorSubject值作为方法的参数？
angular、typescript、behaviorsubject
我使用一个BehaviorSubject来保存一个与其他组件共享的变量(用户名)，它在我的模板上很好地显示用户名。但是，我希望能够在一个服务中使用我的BehaviorSubject的值，然后该值(用户名)被用作如下方法的参数:myMethod(用户名){ do突}。
问题似乎是，当调用方法时，BehaviorSubject值还没有准备好。我尝试在构造函数和ngOnInIt中调用该方法，如果我将它记录到控制台，它将显示它最初是未定义的，最后它用正确的(用户名)值进行日志记录。是否可以使用BehaviorSubject获得作为参数传递给方法的值？
在我的示例中，我有一个auth.service，它
浏览 0提问于2019-04-23得票数 1
回答已采纳
1回答
Angular2.0.0 -获取查询字符串(带?)来自url hashtag位置策略
angular、query-parameters、angular2-router
我使用angular 2.0.0，我有一个这样的网址：
我想从中得到MY_TOKEN。我尝试了所有我能在这里找到的东西，但我只得到了"undefined“。
第二个问题是我使用hashtag定位策略，如果我像这样访问URL，它会被转换为 (查询字符串消失了)，我唯一可以访问这个令牌的时间是在它被转换之前的主组件中，但我不知道如何获取它，我找到的大多数东西都引用了矩阵表示法查询参数。
你对我如何解决这个问题有什么建议吗？
这是我的代码：
export class ResetPasswordComponent implements OnInit {
constructor(priv
浏览 0提问于2016-10-09得票数 1
2回答
角度5:保护将检索到的数据转发到下一个组件/路由
javascript、angular5、angular-router
在angular 5应用程序中，有一个从API检查对象是否存在路由守卫：
//guard.ts摘录
canActivate(
next: ActivatedRouteSnapshot,
state: RouterStateSnapshot
): Observable<boolean> | Promise<boolean> | boolean {
return this.clientService.get(next.params.id).switchMap( data => {
return Observable.of(true);
})
浏览 2提问于2018-01-31得票数 0
5回答
尝试使用输入装饰器将对象从api传递给子组件
angular、input、angular-decorator
我有一个父组件，它使用服务从api接收数据。我需要将此数据传递给子组件，因为我不想再次调用api (严格规则)。我可以访问父组件中的数据，但不能在子组件中获取数据。我试过很多不同的方法。
import { Component, OnInit, ViewChild } from '@angular/core';
import {ActivatedRoute} from "@angular/router";
import {SwapiService} from "../../models/swapi.service";
import {Starshi
浏览 9提问于2020-11-17得票数 0
1回答
角2路由url问题
angular、redirect、routing、url-parameters
这是我的app.module.ts文件。
imports: [
UniversalModule, // Must be first import. This automatically imports BrowserModule, HttpModule, and JsonpModule too.
RouterModule.forRoot([
{ path: '', redirectTo: 'home', pathMatch: 'full' },
{ path: &#
浏览 3提问于2017-03-30得票数 0
回答已采纳
8回答
在2018腾讯云云+未来峰会上介绍了腾讯云如何助力加速物联网+，提供了“高性能、低门槛”的一站式开发管理平台IoT开发平台，将如何解决目前的互联网开发中遇到的问题？涉及哪些技术支撑？
浏览 1814提问于2018-06-04
2回答
跨视图的角度更新值
html、angular、typescript
我有一个角度应用程序，它有以下功能:一个组件有一个文本输入和一个按钮。用户填写文本输入并单击按钮。这将更新路由器链接的URL。
路由器链路加载一个名为view的组件，然后从路由器链接读取URL参数，并将该值放在服务中并显示在组件上，这样我就知道它工作了。
因此，如果用户在文本输入中输入'abc‘，那么路由器链接URL将是/view/abc。因此，'abc‘将显示在视图组件中。有时，用户会粘贴/view/def之类的路由器链接。这可以用于更新视图组件。
我无法工作的部分是更新其他组件中的文本输入框，以反映粘贴链接的当前值。
我尝试使用'AfterViewChecked‘从
浏览 2提问于2022-05-10得票数 0
回答已采纳
1回答
如何在我的应用程序中获得来自不同地方的当前路径和参数？
angular、angular2-routing
在正在进行路由的组件(以及路由器出口所在的位置)中，我可以像往常一样使用ActivatedRoute，但是我有一个组件在路由更改之间保持静态，它需要知道当前的路由和路由参数。在角文档中，它说：
您可以使用路由器服务和RouterState属性从应用程序的任何位置访问当前的routerState。
但我不确定这一页是怎么解释的。它没有提到任何地方的routerState属性。
浏览 0提问于2017-01-23得票数 0
1回答
在子模块中访问路由ID
angular、routing
我是Angular routing的新手，正在尝试从路由访问ID，但似乎没有参数可用。下面是我的路由的组织方式(这是在app.module.ts中导入的)： import {FinancePageModule} from './client-detail/finance/finance.module';
import {AuthGuard} from '../../auth/auth.guard';
import {ClientDetailPageModule} from './client-detail/client-detail.module
浏览 18提问于2019-12-17得票数 0
5回答
Angular 6在两个不相关的组件之间传递数据
angular、typescript、routing、observable
我有一个course-detail组件，它包含来自我的后端应用程序的数据(名为course)，我想将这些数据传递给另一个与该组件无关的组件(course-play)。我想在这两个组件中显示我从后端获得的相同数据。以下是相关文件：
app-routing-module：
import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { CourseListComponent } from './cours
浏览 2提问于2018-07-19得票数 4
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
对象存储
即时通信 IM活动推荐
腾讯云开发者
