小编Don*_*Kim的帖子

当我检查我的组件元素时,有时它width和height0都是0,即使我在里面检查,组件包含的元素也有一定的宽度和高度.这使我不能够因为即使当我设置样式host元素width,并height通过声明向主机元素:host { // styles }这是行不通的.所以,我最终增加一个额外的div组件元件的周围包裹给一些width和height我详细找到它.这是自然而然的事吗？或者我错过了什么？

我一直在enum研究 TypeScript，它让我思考使用它的意义何在。我不是在质疑它的价值。只是我不熟悉它的用法，这导致我编写代码，例如声明某种类型的对象，这些对象在整个应用程序中使用常量而不使用enum. 总而言之，使用它的意义是什么，与仅使用/声明保留一些常量的手动对象有何区别？任何见解将不胜感激！

我注意到某些元素上的鼠标移动会连续触发更改检测。我研究过这个问题并发现他们建议使用runOutsideAngular的方法NgZone。

所以我尝试过，

this.zone.runOutsideAngular(() => {
  this.element.addEventListener('mousemove', {});
});

这根本不起作用。

我是否误用了runOutsideAngular或者是否有其他解决方法来防止对 mousemove 事件进行无休止的更改检测？任何见解将不胜感激！

我已经通过以下
方式安装了我需要的依赖项：vis.js: npm install vis --save
@types/vis:npm install @types/vis --save-dev

代码片段：

import { Component, AfterViewInit, ElementRef, ViewChild } from '@angular/core';
import { Network, DataSet } from 'vis';

@Component({
  selector: 'test',
  template: '<div #network></div>'
})
export class TestComponent implements AfterViewInit {
  @ViewChild('network') el: ElementRef;
  private networkInstance: any;

  ngAfterViewInit() {
     const container = this.el.nativeElement;
     const nodes = new DataSet<any>([
        {id: 1, label: 'Node 1'},
        {id: 2, label: 'Node 2'},
        {id: 3, label: 'Node 3'},
        {id: 4, label: 'Node 4'},
        {id: 5, …

根据官方文档和其他文章，Angular 提供了几种设置宿主元素样式的方法。

通过：

• :host.css文件中的选择器
• @HostBinding
• Renderer2

通过:host选择器，我可以声明一些静态样式。

动态改变宿主元素的样式怎么样？
比如说，我想display在发生事件时更改主机元素的状态：

使用@HostBinding

export class UseHostBindingComponent {
  @HostBinding('style.display') display: string;

  // Change the display state of the host element
  onClick(): void {
    this.display = 'none';
  }
}

使用Renderer2

export class UseRenderer2Component {
  constructor(
    private renderer: Renderer2,
    private el: ElementRef
  ) {}

  // Change the display state of the host element
  onClick(): void {
    this.renderer.setStyle(this.el.nativeElement, 'display', 'none');
  }
}

两种方法都有效，但我只是想知道它们之间的区别。任何见解将不胜感激！

我是 Angular 环境的新手，最近，我一直在为变更检测策略而苦苦挣扎。根据我读过的许多文章，使用 OnPush 策略，一个组件会告诉 Angular，除非我的输入绑定发生更改，否则您可以为我跳过更改检测。我的问题来了：正如标题所说，如果组件没有输入绑定，OnPush 策略会无用/错误吗？

我已经浏览了文档，它说/建议将服务放在 下，CoreModule如果它们将在整个应用程序中使用，而不是将服务包含在 下，SharedModule因为如果将服务导入到延迟加载中，可能会出现一些意外的结果模块。所以我打算遵循该指南，但我遇到了一些文章，这些文章说可以将服务保留在 下，然后使用静态方法SharedModule将其导入到 中。我明白该方法试图表达的意思，但我不明白这种方法有什么更好的地方。两种方法各有优缺点吗？或者我可以按照文档中的指导采用方法吗？AppModuleforRootCoreModule

说有ChildComponent哪个会发出一个叫做的事件someEvent.很显然,我能赶上事件ParentComponent声明一样,<child-component (someEvent)="onSomeEvent($event)"></child-component>并且该方法处理它onSomeEvent的ParentComponent.但我正在尝试的是,我想fromEvent在RxJS中使用运算符处理事件.我试图fromEvent(this.childComponent.nativeElement, 'someEvent')获得后ElementRef的ChildComponent用@ViewChild.我发现如果输出EventEmitter的事件名称与其中一个本机事件相同click但上面没有响应/工作,则上述方法有效.有没有办法让它合作fromEvent？

我知道Angular *ngIf和hidden属性之间的区别:

*ngIf:将元素添加/删除到DOM.

hidden:只需显示/隐藏DOM中的元素.

我不确定的是选择一个而不是另一个的正确条件(？).在一个条件下删除元素并再次添加它听起来有点贵,但与此同时,让它与hidden属性保持在DOM中似乎是不对的.

我已经贴到*ngIf像我一样可以,但它有时会发出当我尝试访问该元素在错误*ngIf模板即使我改变的条件下*ngIf,以true(可能是因为我不习惯到DOM更新周期) .在这些情况下,我使用hidden属性,而不是因为它似乎是正确的.

所以关键是,我想知道明确的标准/标准来选择一个而不是另一个.

非常感谢.

Error: ViewDestroyedError: Attempt to use a destroyed view: detectChanges at viewDestroyedError

当尝试通过使用detectChanges组件中的方法来触发更改检测到另一个页面时，出现此错误。我发现如果使用markForCheck方法，我不会收到错误消息。我知道这两种方法的区别，但是我不明白为什么detectChanges会在销毁过程中导致此错误。有任何想法吗？

import { Component, ChangeDetectorRef, OnInit } from '@angular/core';

@Component({
    selector: 'my-app',
    templateUrl: './app.component.html',
    styleUrls: [ './app.component.css' ]
})
export class ChildComponent implements OnInit {
    data: any;
    constructor(
      private changeDetector: ChangeDetectorRef,
      private somethingService: SomethingService
    ) {
    }

    ngOnInit() {
        this.somethingService.getData().subscribe(data => {
            this.data = data;
            this.changeDetector.detectChanges();
        });
    }
}

我对 Angular 还很陌生，我发现有类似Renderer2,ViewChild和的东西，是ElementRef为了处理 DOM 而不是直接访问它。我遇到的文章说直接操作 DOM 是一个坏主意，所以我们应该使用那些 Angular 提供的包装器和服务，无论它是什么。所以我想知道，在什么情况下直接处理 DOM 是一个坏主意？任何见解将不胜感激！

我正在考虑将我的项目迁移moment到date-fns其中被称为简单，功能等。但是在我玩了一段时间后，我注意到他们还不支持timezone。他们已经推出locale和timezone选项，在format最近和其他功能的阿尔法2.0.0但locale选项只是一种语言支持以及timezone在这些功能只是显示选项/添加GMT符号（例如：2018年8月29日格林尼治标准时间+ 9）。所以我想知道我是否只是想念它，尽管他们已经支持它，或者他们真的还没有支持它。