小编Tar*_*alo的帖子

我必须为Eclipse开发一个插件,但我更喜欢IntelliJ IDEA作为IDE.是否可以为Eclipse插件开发配置IDEA？

我有一个带有单个按钮的简单组件，该按钮可以启动和暂停由RxJS计时器生成的数字流。

import { Component, OnInit } from '@angular/core';
import { BehaviorSubject, Observable, timer, merge } from 'rxjs';
import { filter, bufferToggle, windowToggle, mergeMap, mergeAll, share } from 'rxjs/operators';

@Component({
  selector: 'my-app',
  template: `<button (click)="toggle()">{{ (active$ | async) ? 'Pause' : 'Play' }}</button>`,
  styleUrls: [ './app.component.css' ]
})
export class AppComponent implements OnInit {
  active$ = new BehaviorSubject<boolean>(true);

  ngOnInit(): void {
    const on$ = this.active$.pipe(filter(v => v));
    const off$ = this.active$.pipe(filter(v => !v));

    const stream$ = timer(500, 500).pipe(share());

    const out$ = …

我有一个微型应用程序，在屏幕上显示一个点。

这是绑定到NgRx存储中的状态的简单div。

<div class="dot"
   [style.width.px]="size$ | async"
   [style.height.px]="size$ | async"
   [style.backgroundColor]="color$ | async"
   [style.left.px]="x$ | async"
   [style.top.px]="y$ | async"
   (transitionstart)="transitionStart()"
   (transitionend)="transitionEnd()"></div>

点状态更改由CSS过渡设置动画。

.dot {
  border-radius: 50%;
  position: absolute;

  $moveTime: 500ms;
  $sizeChangeTime: 400ms;
  $colorChangeTime: 900ms;
  transition:
    top $moveTime, left $moveTime,
    background-color $colorChangeTime,
    width $sizeChangeTime, height $sizeChangeTime;
}

我有一个后端，它推送点的更新（位置，颜色和大小）。我将这些更新映射到NgRx动作上。

export class AppComponent implements OnInit {
  ...

  constructor(private store: Store<AppState>, private backend: BackendService) {}

  ngOnInit(): void {
    ...

     this.backend.update$.subscribe(({ type, value }) => {
       // TODO: trigger new NgRx action when all animations …

我正在使用无限滚动和数据延迟加载来分析列表.什么可以导致这个漫长的"复合层"阶段？

和

如果您对该列表的详细信息感兴趣:

• 该列表具有有限数量的物理行元素,并在滚动时使用"transform:translate3d(...)"对它们进行重新排序.
• Chrome会在单独的图层中绘制每一行.
• 整个浏览器页面中最多只有25个图层.

例如,我们有一个包含本地化字符串的文件

{
  "title": "Example title",
  "description": "Some text"
}

我们假设我们还有一个带有一些自定义装饰器的组件 @I18n()

@Component({ ... })
@I18n('./my-translations.json')
export class MyAngularComponent {

}

和模板

<h2>{{ i18n.title }}</h2>
<p>{{ i18n.description }}</p>

是否有可能包括一个或多个外部资源(除了templateUrl和styleUrls)到组件？

我的单页应用 (SPA) 中的某些 URL 包含敏感信息，例如访问令牌、用户信息等。

例子：

/callback#access_token=HBVYTU2Rugv3gUbvgIUY
/?email=username@example.com

我看到hotjar允许从跟踪数据中抑制 DOM 元素和图像。是否可以在 URL 中隐藏参数或至少禁用某些页面的跟踪？

有“显示原始来源”复选框，但似乎不起作用。我试图找到一种方法来禁用 FF Developer Tools 和 Firebug 中的源映射，但没有任何成功。

顺便说一句：在 Chrome 开发工具中禁用它们很容易。

我想从树结构中生成一个反应形式.

以下是创建表单项(表单组和控件)的代码.对于嵌套在表单组中的控件,我使用递归模板.

import { Component, Input, NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { FormBuilder, FormGroup, FormsModule, ReactiveFormsModule, Validators } from '@angular/forms';

@Component({
  selector: 'form-item',
  template: `
    <ng-container [formGroup]="form">
      <ng-container *ngTemplateOutlet="formItemTemplate; context:{ $implicit: pathSegments }"></ng-container>

      <ng-template #formItemTemplate let-pathSegments>
        
        <ng-container *ngIf="pathSegments.length > 1">
          <div [formGroupName]="pathSegments[0]" class="form-group">
            <ng-container *ngTemplateOutlet="formItemTemplate; context:{ $implicit: pathSegments.slice(1) }"></ng-container>
          </div>
        </ng-container>

        <ng-container *ngIf="pathSegments.length === 1">
          <div class="form-control">
            <label>{{pathSegments[pathSegments.length - 1]}}</label>
            <!--<input type="text" [formControlName]="pathSegments[pathSegments.length - 1]"/>-->
            <input type="text"/>
          </div>
        </ng-container>
        
      </ng-template>
    </ng-container>
  `,
})
export …