问题[angular2]

该组件有一个服务调用，响应后您需要检查内部状态或调用另一个方法或显示模式窗口，然后调用此方法。这导致订阅中的订阅。请告诉我如何删除第二个订阅。条件代码：stackblitz 上的示例代码

伙计们安装了 13 版，从旧项目中拖出方法并subscribe划掉。

我知道它已经过时了，但我不知道如何改变它。告诉我在哪里挖。

registration = (Email: string, Username: string, Password: string) => {
    this.api.regUser(Email, Username, Password).subscribe(
        data => {
            this.router.navigate(['']);
        },
        error => {       
        }
    );
}

朋友们，我正在尝试为 Angular Material 定制一个主题。我似乎在按照官方指南做所有事情。

@import "~@angular/material/theming";

$md-editor: (
  50: #e4f6ff,
  100: #bce9ff,
  200: #8fdbff,
  300: #62ccff,
  400: #41c1ff,
  500: #1fb6ff,
  600: #1bafff,
  700: #17a6ff,
  800: #129eff,
  900: #0a8eff,
  A100: #ffffff,
  A200: #f5faff,
  A400: #c2e0ff,
  A700: #a8d4ff,
  contrast: (
    50: #000000,
    100: #000000,
    200: #000000,
    300: #000000,
    400: #000000,
    500: #000000,
    600: #000000,
    700: #000000,
    800: #ffffff,
    900: #ffffff,
    A100: #000000,
    A200: #000000,
    A400: #000000,
    A700: #000000,
  ),
);

$template-editor-primary: mat-palette($md-editor);
$template-editor-accent: mat-palette($md-editor, A200, A100, A400);
$template-editor-warn: mat-palette($md-editor);
$template-editor-theme: mat-light-theme($template-editor-primary, $template-editor-accent, $template-editor-warn);

@include angular-material-theme($template-editor-theme);
@include mat-core();

我创建了这个 theme.scss 文件，将其添加到 angular.json，但我观察到以下情况 - 有些东西将我的颜色重新定义为 mat-deep-purple。

为什么会这样，我不明白，根据代码，该主题没有其他定义。有没有人有任何选择或想法？谢谢

有一个改进的下拉框组件，当焦点丢失时，我想隐藏下拉列表。这是代码

import { Attribute, Component, Input, HostListener, Output, EventEmitter } from '@angular/core';

@Component({
  selector: 'app-dropbox-comp',
  templateUrl: './dropbox.component.html',
  styleUrls: ['./dropbox.component.scss']
})
export class DropboxComponent{
  @Input() selected: object;
  @Input() array: [];

  @Output() selectedChange = new EventEmitter<object>();

  public isOpen = false;

  constructor(@Attribute('tabindex') public tabIndex: number = 0) {}

  toggle(){
    this.isOpen = !this.isOpen;
  }

  change_value(item){
    this.selectedChange.emit(item);
  }

  @HostListener("blur") //Не работает
  lostfocus(){
    this.isOpen = false;
  }

}

标记

<div class="dropdown selectDropdown" [ngClass]="{'open': isOpen}" (click)="toggle()" (blur)="lostfocus()">
  <ul (blur)="lostfocus()">
    <li *ngFor="let item of array; let i = index" (click)="change_value(item)"><a>{{item.name}}</a></li>
  </ul>
  <span>{{selected['name']}}</span>
</div>

联系

    <app-dropbox-comp [array]="store['sortCarsParameters']['data']"  
 [selected]="store['sortCarsParameters']['selected']"></app-dropbox-comp>

有一个改进的下拉框组件，它显示数据，然后我想向上传递选定的值，当焦点丢失时，隐藏下拉列表。这是代码

import { Component, Input, HostListener } from '@angular/core';

@Component({
  selector: 'app-dropbox-comp',
  templateUrl: './dropbox.component.html',
  styleUrls: ['./dropbox.component.scss']
})
export class DropboxComponent{
  @Input() selected: object;
  @Input() array: [];

  public isOpen = false;

  constructor() { }

  toggle(){
    this.isOpen = !this.isOpen;
  }

  change_value(item){
    this.selected = item;
  }

  @HostListener("blur") //Не работает
  lostfocus(){
    this.isOpen = false;
  }

}

标记

<div class="dropdown selectDropdown" [ngClass]="{'open': isOpen}" (click)="toggle()" (blur)="lostfocus()">
  <ul (blur)="lostfocus()">
    <li *ngFor="let item of array; let i = index" (click)="change_value(item)"><a>{{item.name}}</a></li>
  </ul>
  <span>{{selected['name']}}</span>
</div>

联系

    <app-dropbox-comp [array]="store['sortCarsParameters']['data']"  
 [selected]="store['sortCarsParameters']['selected']"></app-dropbox-comp>

问题：
1）如果我离开组件，我不能“关闭”它
2）所选值在组件内保持选中状态，但不会作为双重绑定和 [selected]="store['sortCarsParameters' ]['selected' ]" 保持不变。如何改变这个值？