标签: angular7

我正在使用WebStorm(版本2018.2.5)来开发我的Angular应用程序.更新到Angular 7后,我总是在WebStorm的TypeScript窗口中收到以下错误:

Error:Initialization error (angular 2 language service). Cannot read property 'CommandTypes' of undefined

经过研究,我发现了JetBrains的这个跟踪问题,它说它已经修复了2018.2.3版本.链接

所以我不应该再犯这个错误了吗？但它仍然存在..我的应用程序仍然可以编译和运行命令,ng serve所以我的应用程序仍然正确运行.

任何人都知道如何摆脱这个错误？这个错误与JetBrains WebStorm有关吗？

我已将角度6版本更新为角度7版本.现在,当我尝试导航到' http:// localhost:4200/pages ' 时,我收到错误.我在我的应用程序中使用延迟加载路由概念.

错误:-

core.js:12584 ERROR错误:未捕获(在承诺中):错误:找不到模块'./Pages/Test/Test.module'错误:无法在$ _lazy_route_resource懒惰中找到模块'./Pages/Test/Test.module'命名空间对象:5,位于ZoneDelegate.push的Object.onInvoke(core.js:14143)的ZoneDelegate.push ../ node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke(zone.js:388). Zone.push上的/node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke(zone.js:387)../ node_modules/zone.js/dist/zone.js.Zone.run(zone.js: 138)在zone.les:872 at ZoneDelegate.push ../ node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask(zone.js:421),位于ZoneDelegate的Object.onInvokeTask(core.js:14134) Zone.push上的.push ../ node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask(zone.js:420)../ node_modules/zone.js/dist/zone.js.Zone.runTask( zone.js:188)$ _lazy_route_resource lazy namespace object:5 at ZoneDelegate.push ../ node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke(zone.js:388)at Object.onInvoke(core. js:14143)在ZoneDele zone.push ../ node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke(zone.js:387)在Zone.push ../ node_modules/zone.js/dist/zone.js.Zone.run (zone.js:138)

APP-routing.ts

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { Routes} from '@angular/router';

export const AppRoutes : Routes = [
 {
  path : '',
  redirectTo: 'test',
  pathMatch: 'full',
 }
 {
  path: 'test',
  loadChildren: './Pages/test/test.module#TestModule'
 }      
] …

我知道这个问题以前有人问在这里。但是接受的解决方案不适用于我，或者我无法很好地理解它。

我正在使用ng-7，我有一个简单的用例：

我有2个API，第2个取决于1st的响应。我订阅第一个API的结果，然后使用管道订阅第二个API的结果。

我的代码如下所示；

this._SomeService
        .addUserToDb(payload)
        .pipe(
          map(res => res),
          mergeMap(db1Response =>
            this._SomeService.addUserToDb2(db1Response
            )
          ),
          catchError(errodb1 => {

            return Observable.throw(new 
            Error(errorSso));
          })
        )
        .subscribe(
          resDb2 => {
              // Here I get response of addUserToDb2
          },
          errDb2 => {


          }
        )

现在，在订阅第二个API响应之前，我想订阅另一个可观察的说法：

this._tokenService.getToken.pipe（

）

并希望在服务2中使用它的响应。这样：

API1 =>令牌=> API2

请建议如何实施。

更新：

我尝试实现，以下是我的实现：

  this._service.addUserToDB1(payload).pipe(
          map(resp => this.resDB1 = resp) // Adding to global variable because I need this response while subscribing to DB2 service.
          ,mergeMap(resdb1=>this._tokenService.getToken.pipe(
            mergeMap(token => this._service.addUserToDb2(
              this.resDB1,
              this.organizationId,
              this.practitionerId, …

我有一个mat-menu包含多个复选框的应用程序，我希望用户在检查所需的所有类型的过滤器时将其关闭。

实际的行为是当您单击任何内容时，它将自动关闭。

我有以下代码：

<button color="warn" mat-button [matMenuTriggerFor]="menu">Menu</button>
<mat-menu #menu="matMenu">
  <button mat-menu-item>
    <mat-checkbox color="warn">
      By LM
    </mat-checkbox>&nbsp;
  </button>
  <button mat-menu-item>
    <mat-checkbox color="warn">
      By UN
    </mat-checkbox>&nbsp;
  </button>
</mat-menu>

我在堆栈溢出时检查了此帖子，但该事件未起作用。

他们从文档中说：

@Output（）关闭：EventEmitter

菜单关闭时发出的事件。

但是我无法弄清楚如何使用此输出，以及它是否与我需要的输出有关。

这是一堆堆炸弹。

如何防止mat-menu在用户未单击的情况下关闭？

我已经通过angularx-social-login集成了社交登录名（Google和Facebook），现在找到了一种集成基于Microsoft帐户的方法。

有没有办法将Microsoft帐户（hotmail，live，outlook）与Angular集成？

网络中的所有搜索和示例大部分都特定于Microsoft Azure。是否有任何npm库可以集成此库？有任何想法吗？

我正在使用角度7的Drag n Drop，并将其放置在div中：

<div class="myDiv" cdkDrag (dblclick)="toggleDraggable($event)">Div Content Here</div>

所以我需要做的是，当我双击cdkDrag上方的这个div时，它会打开和关闭。

是否消失。只需切换可拖动对象即可。

我怎样才能做到这一点？

我正在尝试使用Angular Material进行拖放，如在列表之间转移项目所示。

我正在尝试示例中显示的完全相同的代码，但在控制台中收到此错误：

未捕获的错误：模板解析错误：没有将“ exportAs”设置为“ cdkDropList”的指令

下面是我的代码，与链接中显示的代码相同，无论如何我都在共享：

TS：

import {Component} from '@angular/core';
import {CdkDragDrop, moveItemInArray, transferArrayItem} from '@angular/cdk/drag-drop';

/**
 * @title Drag&Drop connected sorting
 */
@Component({
  selector: 'cdk-drag-drop-connected-sorting-example',
  templateUrl: 'cdk-drag-drop-connected-sorting-example.html',
  styleUrls: ['cdk-drag-drop-connected-sorting-example.css'],
})
export class CdkDragDropConnectedSortingExample {
  todo = [
    'Get to work',
    'Pick up groceries',
    'Go home',
    'Fall asleep'
  ];

  done = [
    'Get up',
    'Brush teeth',
    'Take a shower',
    'Check e-mail',
    'Walk dog'
  ];

  drop(event: CdkDragDrop<string[]>) {
    if (event.previousContainer === event.container) {
      moveItemInArray(event.container.data, event.previousIndex, event.currentIndex);
    } …

我有拖放formBuilder，我们可以使用拖放创建表单，所以现在我面临的问题是，我在templeteJson的html中隐藏了字段。

这是HTML代码

 <form [formGroup]="userForm" (ngSubmit)="onSubmit()">
    <div class="form-group">
      <label>Form Name:</label>
      <input type="text" class="form-group" formControlName="TemplateName" />
    </div>
    <div class="form-group">
      <input type="hidden" class="form-group" formControlName="TemplateJson" />
    </div>
    <div class="form-group">
      <label>CreatedOn:</label>
      <input type="date" class="form-group" formControlName="CreatedOn" />
    </div>
    <button type="submit" class="btn btn-primary">Submit</button>
  </form>

这是component.ts文件

  formBuilder: any;
  formData: any;
  data: any;
 ngOnInit() {
    var id = this.route.snapshot.paramMap.get('id');

    this.dataService.GetFormById(+id).subscribe(response => {
      this.data = response['TemplateJson'];
      this.generateForm();
    },
      err => {
        this.generateForm();
      });

    initJq();
  }

userForm = new FormGroup({
    TemplateName: new FormControl(),
    TemplateJson: new FormControl(),
    CreatedOn: new FormControl(),
  });

 onSubmit() …

我需要在Angular 8的项目中创建一个组件，我尝试了以下命令：

ng g c prueba

但它返回错误为：

检测到无效的格式版本-预期：[1]找到：[3]

你能帮我解决吗？

假设我在屏幕上产生了100个div，*ngFor该div的值来自对象的数据，例如

{A1: someObject, A2: someOtherObject..., J10: someOtherOtherObject}

我单击A1，然后单击J10，它们切换其值。改为：

{A1: someOtherOtherObject, A2: someOtherObject..., J10: someObject}

如何强制Angular仅刷新仅包含A1和J10值的两个div？我正在使用ChangeDetectionStrategy.OnPush，在拥有的构造函数中cd.detach()，只有cd.detectChanges()在第二次单击发生时才调用。从我所看到和能够理解的角度来看，每个div都会触发它们，*ngIf因此将重新创建每个div 。

我可以做些什么来要么a）覆盖正在刷新的内容，要么b）选择检测更改所针对的内容？