小编Ric*_*ico的帖子

问题
我订阅了两次httpClient.get observable.但是,这意味着我的调用会被执行两次.为什么是这样？

证明
对于我做的每个订阅(),我在登录页面中得到另一行.

代码(来自登录页面按钮的onSubmit())

var httpHeaders = new HttpHeaders()
  .append("Authorization", 'Basic ' + btoa(this.username + ':' + this.password));

var observable = this.httpClient.get('api/version/secured', { headers: httpHeaders});
observable.subscribe(
  () => {
    console.log('First request completed');
  },
  (error: HttpErrorResponse) => {
    console.log('First request error');
  }
);
observable.subscribe(
  () => {
    console.log('Second request completed');
  },
  (error: HttpErrorResponse) => {
    console.log('Second request error');
  }
);

安慰

zone.js:2935 GET http://localhost:4200/api/version/secured 401 (Unauthorized)
login.component.ts:54 First request error
zone.js:2935 GET http://localhost:4200/api/version/secured 401 (Unauthorized)
login.component.ts:62 First request error …

抽象查询

select A.*, B.*, C.*
from A
left join B on B.aId = A.aId
left join C on C.cId = B.cId

想法
我想将它提取到某个对象中，该对象按 A 分组（每个 B 都有一个唯一的 C 与之相连）。对我来说，要获取的最合乎逻辑的对象类型是 Map<A, List<Record2<B,C>> 之类的东西。

代码
我试过类似的东西

using(configuration()).select(A.fields())
        .select(B.fields())
        .select(C.fields())
        .from(A)
        .leftJoin(B).on(B.aId.eq(A.aId)
        .leftJoin(C).on(C.cId.eq(B.cId)
        .fetchGroups(
            r -> r.into(A).into(APojo.class),
            r -> r.into(B).into(BPojo.class),
            r -> r.into(C).into(CPojo.class)); // Goes wrong because fetchGroups only accepts 2 arguments

解决方案的背景
我不想使用 fetch()，因为所有记录都会包含 A 的重复数据，我想避免这种情况。我将其转换为 JSON 对象，其中 A 将包含 B 的列表，其中 B 包含对象 C。要获得此结构， Map<A, List<Result2<B,C>> 将是完美的。

注意：我看到了几个像我的标题这样的问题，但它们并没有解决我的问题。喜欢：

• 具有多个子组件实例的Angular2父组件（只是代码错误）
• 实例 Angular 2 组件两次（这是关于引导，而不仅仅是组件）

情况
我的 angular 应用程序中有几个模板驱动的表单，带有多个日期字段。我制作了一个特殊的组件 (DatePickerComponent)，我将它作为子组件插入到所有这些表单中。

问题
组件内部的变量是共享的。Angular 可能会实例化同一个对象，但我想要不同的实例！我很清楚如何做到这一点。

我认为是解决方案
它可能与您声明 DatepickerComponent 的位置有关。我在 app.module.ts 中声明了它，但这会为整个应用程序创建一个实例。我不知道如何确保我的父组件被迫使用两个不同的子组件。

推理
我在一个单独的组件中执行此操作，因为我还没有日期选择器。现在它是一个带有模式表单验证的文本框。稍后我会做出更好的东西（一个真正的日期选择器），我不想到处复制粘贴代码并犯错误。使用 1 个组件，这很容易做到。

具体代码

import {Component, EventEmitter, Input, OnInit, Output} from "@angular/core";
import {ControlContainer, NgForm} from "@angular/forms";

@Component({
  selector: 'app-datepicker-component',
  templateUrl: './datepicker.component.html',
  // Add viewProviders, so the input will be treated part of the form in the parent.
  // /sf/ask/2746955361/
  viewProviders: [ { provide: ControlContainer, useExisting: NgForm } ]
})
export class DatepickerComponent implements OnInit { // …