我有一个项目,我有一个地图(使用ngx-leaflet).
在点击一个标记,我想说明从对话框角材料.

对话框打开但是当我单击关闭按钮时,它会再次重新打开然后关闭.

我尝试了什么:

• 使用超时延迟对话框
• 触发打开对话框的主题
• 删除并创建新的Dialog
• 在ngx-leaflet和angular-material问题中搜索此错误

我发现了什么:

• 发生某些事情后触发所有生命周期钩子(点击,后面的js事件,任何事物)
• Dialog可以很简单,但不会改变任何东西
• 当我关闭时再次打开对话框(在AfterClosed of Dialog中)它正常工作

示例代码的进一步说明:

• 在App.component.ts中,我将一个事件处理程序绑定到每个标记,然后在另一个函数中打开该对话框
• 代码是我在网上找到的这个项目的一个分支(只是更新了依赖项)

演示

我在这里做了一个演示:示例项目.

问题

我最近想用 Angular 动画简短地突出显示一个元素。但是我没有找到没有状态的方法。所以这就是我想出的：

临时解决方案

animations: [
    trigger('highlightRed', [
      transition('*=>hasError', animate('2000ms', keyframes([
        style({backgroundColor: 'initial', boxShadow: 'none', offset: 0} ),
        style({backgroundColor: '#ff5c4c', boxShadow: '0 0 5px #ff5c4c', offset: 0.1} ),
        style({backgroundColor: 'initial', boxShadow: 'none', offset: 1} ),
      ])))
    ])
  ]

...
...

public showError(){
   this.errorState = "hasError";
}

<span [@highlightRed]="errorState" (@highlightRed.done)="errorState = ''">

StackBlitz 演示

题

这种类型的动画甚至可以使用 Angular (-Animations) 还是我必须使用老式 css 动画，我将如何理想地触发它们？

版本

角 7

我正在构建一个Angular Universal App，现在我所拥有的只是该网站的结构。我所做的所有事情都像教程中有关为Angular Universal转换我的应用程序一样。

console.log("got Request " + new Date());
res.render(join(DIST_FOLDER, 'browser', 'index.html'), { req , time: true}, 
   function(err, html) {
      console.log("finished Rendering " + new Date());
      res.send(html);
   }   
);

渲染需要3个半秒。.对我来说，这似乎是很长的时间。同样在Chrome TTFB中的DeveloperTools中为3.5秒。而且该应用程序除了路由之外什么也不做。我不希望我的未来应用这么慢。

是否有人知道这是正常现象还是需要改进的地方？Github回购与问题 https://github.com/Joniras/slow-universal-rendering-example

设置工作区并运行角度通用：

npm install   
npm run build:universal   
npm run serve:universal     

版本：
Angular CLI: 1.5.0
Node: 6.11.5 OS: win32 x64 Angular: 5.0.1 ... animations, common, compiler, compiler-cli, core, forms ... http, language-service, platform-browser ... platform-browser-dynamic, platform-server, router @angular/cdk: 5.0.0-rc0 @angular/cli: 1.5.0 @angular/flex-layout: 2.0.0-beta.10-4905443 @angular/material: 5.0.0-rc0 @angular-devkit/build-optimizer: 0.0.33 @angular-devkit/core: …