问题标签 [subject-observer]

我只是在开发一个新的 Angular 6 WebApp，它的组件之间的整个通信都是基于主题和订阅的。

整个订阅在仪表板组件（根目录下的级别 1）中实现。在仪表板上，组件是从带有 SignalR Web 套接字的 C# ASP.NET Core 后端生成的表。

现在我们为该表中的每一行实现了编辑和删除按钮。编辑按钮打开一个 ngx-bootstrap 模态。模态打开函数在参数中采用单行信息。

在这个“编辑模式”里面是一些带有行日期的输入。现在，当我保存更改时，数据将被发送回仪表板组件，该组件使用 .NET Core API 为行调用更新方法。

在编辑模式和仪表板之间的这个数据流中，我的订阅调用了 4 次。

我试图调试这个，但没有找到任何线索这里发生了什么......

我的通信服务：

编辑模式：

仪表板组件

更新 OrderService 中的订单（Angular 和 SignalR（后端）之间的桥梁）

有人知道为什么我的成功日志从未执行过并且我的调用次数为 4 次吗？

app.component使用 *ngfor 在视图中显示 json 数据。用户可以在他/她在搜索框中键入时执行搜索（基本上是在 keyup 事件上）。

为方便起见，我将此search.component设置为共享组件。

我已经编写了一个代码，想知道这是否是正确的方法，或者是否存在更好的方法。请帮忙。

注意：目前，代码有 7 个条目，但实际条目至少为 1000 个。

这是我的应用程序示例 POC。

search.component.html - 在输入的每个字符上，调用方法getSearchString()

search.component.ts - 使用在公共服务中定义的主题_searchText来发出值。

app.service.ts - 定义正在使用的主题。

app.component.ts - 订阅可观察的getSearchText$以搜索 json。

在 Typescript 中，如何创建一个 Map 来存储不同数据类型的 Subject/BehaviorSubject

在我的一个服务类中，我想要一个地图来存储不同数据类型的主题。（地图的关键是数字）。如何声明地图？下面是示例代码

我正在尝试在 2 个组件之间进行通信。过滤器组件正在尝试通过服务 http-service 向结果组件发送消息。

我能够向服务 http-service 发送消息，但即使我订阅了也无法在结果服务中接收消息。这是代码

视图.module.ts

http服务

过滤器组件.ts

结果.component.ts

我正在尝试在我的组件的 ngOnInit 方法中为以下方法调用编写测试：

这是我的服务：

这是我对组件的测试：

我的测试总是失败？如何在我的组件中测试 observable 调用的调用？

如标题所示，我收到一条错误消息。我在这里搜索了一个解决方案，但不幸@Injectable()的是没有工作，因为我正在使用接口，我也尝试过@Input()。我在这里尝试做的是一个观察者模式，当点击发生某些事情时得到通知。

我试图从这里的视频中复制这种模式：https ://www.youtube.com/watch?v=GioexP_s5Yc 。我多次检查了我的代码，除了我使用 Angular 并尝试在 2 个组件之间调整这种模式外，它并没有什么不同。

这是我的设置：

观察者界面.ts

主题界面.ts

XComponent.ts

Y组件.ts

在我的简单应用程序中，我有 FilterComponent、ListComponent 和一项服务（我称之为 GithubService）。

我需要通过 http 到 github 输入 FilterComponent 地址中的搜索词并将结果返回给 ListComponent。

我不知道每次更改 newSearchText 时服务都会订阅。

我应该保持不动还是以某种方式重构，或者每次都取消订阅？

我有一个侧面导航栏和一个内容 div。我目前想要实现的是，每当我点击侧导航中的任何元素时。该导航项的 innerText 应显示在内容 div 中。我的代码如下

sidenav.component.ts

内容.component.ts

博客服务.ts

请帮我解决这个问题。我能够成功地将内容传递给服务，但是每次单击侧导航项时，内容 ts 文件中的代码都不会被执行。

我的完整代码可以在这里找到 - https://stackblitz.com/github/vibhorgoyal18/atest-blog

我有一个 Mat 表，它通过 Http get 获取数据。我最初在页面加载后填充表格，然后在搜索完成时填充表格。我的表最初被填充，但是当数据源更新时，表没有用更新的数据呈现。我正在使用 subject 来监听任何变化。我可以在控制台中看到更新的值。

和

HTML <mat-table [dataSource]="dataSource" class="mat-elevation-z8"> <ng-container matColumnDef="claim"> <mat-header-cell *matHeaderCellDef>Claim</mat-header-cell> <mat-cell *matCellDef="let element">{{element.claim}}<a fxFlexFill class="mat-row-link"></a></mat-cell> </ng-container> <ng-container matColumnDef="firstName"> <mat-header-cell *matHeaderCellDef>Name</mat-header-cell> <mat-cell *matCellDef="let element">{{element.firstName}} {{element.lastName}}</mat-cell> </ng-container> <ng-container matColumnDef="dateOfBirth"> <mat-header-cell *matHeaderCellDef>Date Of Birth</mat-header-cell> <mat-cell *matCellDef="let element">{{element.dateOfBirth}}</mat-cell> </ng-container> <mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row> <mat-row routerLink="" *matRowDef="let row; columns: displayedColumns;"></mat-row> </mat-table>

我有两个组件（父级和子级）和一个服务，它们同时订阅了一个主题类。但是当主题类使用next方法发出数据时，只有一个组件（子组件）正在获取数据。

navbar.component.ts :(发件人):

message.service.ts：（订阅者）

base-template.component.ts ：（订阅者）（孩子）

action.component.ts（订阅者）（父级）

当数据来自导航栏组件时，只有基本模板subscription函数获取数据，但是如果我subscription从基本模板中删除方法，则subscription操作组件中的方法获取它。但是我希望所有组件和服务中的数据同时呈现，因为它们都同时呈现。如何实现这一点。