小编Dan*_*cák的帖子

我一直想知道为什么我应该使用Angular动画而不是CSS动画.我发现在使用它们之前可能会考虑的几个方面:

性能

在第一步中,我发现这个问题只涉及性能方面.接受的答案对我来说并不令人满意,因为它声明应尽可能使用CSS动画,以便在单独的线程中运行动画的优化可以应用.这似乎不正确,因为Angular文档说明了这一点

角度动画构建于标准Web动画API之上,并在支持它的浏览器上本机运行.

(强调我的)

当我们查看Web Animations API Draft时,我们发现相同的优化可以应用于Web动画,而不是在工作表中指定的CSS.

虽然可以使用ECMAScript使用requestAnimationFrame [HTML]执行动画,但这些动画在声明动画方面的表现方式与它们在CSS级联中的表示方式以及可能的性能优化(例如在单独的线程上执行动画)有所不同.使用Web Animations编程接口,可以从脚本创建具有与声明性动画相同的行为和性能特征的动画.

(再次强调我的)

除了像IE这样的浏览器不支持Web动画,有没有理由使用CSS声明而不是Angular动画,反之亦然？我认为它们是可交换的性能.

更多地控制动画

这可能看起来像Angular动画的一个参数,因为你可以暂停动画或使用它等JS变量,但使用eg时也是如此.CSS animation-play-state: pause或使用JS中指定的CSS变量,请参阅文档.

现在我可以看到在JS代码中设置CSS变量可能不方便,但使用Angular动画时也是如此.这些通常在@Component animations字段中声明并且没有,除了通过动画状态数据绑定属性,访问实例字段(如果你AnimationBuilder当然不通过创建动画,btw也不是很方便或漂亮) .

另一点是,使用Web Animations API可以检查,调试或测试动画,但我不知道Angular动画是如何实现的.如果是的话,请你告诉我怎么样？如果不是这样的话,为了控制,我真的没有看到使用Angular动画而不是CSS的优势.

更清洁的代码

我在这里阅读了一个段落,说明将动画与"普通"样式分开实际上是行为和表现的分离.真的在样式表中声明动画混合了这些责任吗？我总是以另一种方式看到它,特别是在@Component动画中查看CSS规则让我感觉在一个太多的地方都有CSS声明.

那么Angular动画怎么样呢？

• 是否只是一种方便的工具,可以从其他样式中提取动画,还是带来任何有价值的功能？
• Angular动画的使用是否仅在特殊情况下得到回报,还是团队选择一直使用它的约定？

我很想知道使用Angular动画的实际优势.先谢谢你们!

我在 WSL2上的https://0.0.0.0:4000（也可以作为https://local.phx-cd.shoepping.at:4000访问，映射到 Ubuntu 主机文件中的 127.0.0.1）上运行一个简单的 Web 服务器乌班图。我可以从 Ubuntu 和 Windows 主机连接到它 - 到目前为止一切顺利。但此外，在我的 Docker for Win 与 WSL2 集成中，我运行了一个 selenium chrome 容器，该容器正在该 Web 服务器上连接和测试内容（使用网桥），但它无法连接到它！

我连接到容器并尝试卷曲到 Web 服务器 - 连接被拒绝。由于我的计算机上有双启动，我尝试切换到我的 Linux 发行版，在那里运行 Web 服务器并在 Linux Docker 中运行 selenium，并且与本地 Web 服务器的连接工作正常。所以我认为这与 WSL2 有关系。

我的 docker-compose.yaml（我省略了 selenium hub 配置）

selenium-chrome-local:
      image: selenium/node-chrome-debug:3.141.59
      restart: always
      ports:
        - 5901-5902:5900
      volumes:
        - /dev/shm:/dev/shm
        - ../../temp:/home/seluser/Downloads
      depends_on:
        - selenium-hub-local
      environment:
        - SCREEN_WIDTH=1920
        - SCREEN_HEIGHT=1080
      extra_hosts:
        - "local.phx-cd.shoepping.at:10.99.99.1"
      networks:
        - selgrid
        - dockerhost

 networks: …

我习惯于像 React 或 Angular 这样的库/框架，它们都有方便的方法来访问属于逻辑组件的实际 DOM 元素。React 具有createRef实用程序，而 Angular 具有与例如结合的模板变量。@ViewChild.

这些引用不仅使访问 DOM 变得容易，而无需每次都显式查询元素，而且它们还与 DOM 保持同步，以便它们始终保持对当前元素的引用。我刚开始在我的宠物项目中使用 Svelte，但尽管我浏览了 Svelte 的文档和谷歌很多，但我没有找到任何类似的概念和用法。我想这可能与 Svelte 的无运行时概念有关，但仍然不知道为什么没有这样的实用程序。

所以问题是，在 Svelte 中是否有类似的实用程序？

我正在使用 Intellij Idea 基于 Maven 和 JDK 8 开发一个新的 Kotlin 项目。一切都很好，除了在每次 Maven 重新导入之后，由于某种原因编译目标从 1.8 切换到 1.6。

我真的尝试了从 2 个最佳答案到同一问题的所有方法（尽管来自 Java 世界），但没有任何效果对我有用。我也迁移到 Gradle，希望能克服这个问题，但这也无济于事。除了提到的 SO 问题，我浏览了大量论坛，建议始终与提到的 SO 答案相同。

那么问题来了，如何防止Idea在重新导入后切换目标Java版本？

我正在尝试使用邮递员编写用于 api 测试的断言。为了调试，我使用 console.log() 函数，它使 Postman 的控制台变得混乱。

我已经尝试console.clear();过预请求脚本，但出现 TypeError。

邮递员错误：

我可以在 Postman 的预请求脚本或测试部分以编程方式清除控制台吗？

简而言之，我的问题是组件模板中有一个元素。该元素有一个ngIf条件和一个(click)处理程序。它不会从一开始就渲染，因为 ngIf 条件的计算结果为false。

现在有趣的部分来了：在角度区域之外运行的代码将该条件更改为true，并且在detectChanges手动执行更改检测器引用后，该元素将被渲染，并且单击处理程序 ofc 将变为活动状态。

到目前为止，一切似乎都正常，但问题是，当(click)用户单击回调时，不会触发组件的更改检测。

这是复制品https://stackblitz.com/edit/angular-kea4wi

在那里重现它的步骤：

1. 单击米色区域
2. 出现按钮，也单击它
3. 尽管消息应该出现在下面，但什么也没发生

描述：

1. 米色区域有一个通过 addEventListener 注册的点击事件处理程序，并且该事件监听器的回调在角度区域之外运行。在其中，组件的showButton属性设置为从false到true，我通过调用 手动触发更改检测detectChanges()，否则属性中的更改showButton将不会被注册。代码如下所示：

   this.zone.runOutsideAngular(() => {
      const el = this.eventTarget.nativeElement as HTMLElement;
      el.addEventListener('click', e => {
        this.showButton = true;
        this.cd.detectChanges();
      })
    })
   

   Run Code Online (Sandbox Code Playgroud)

2. 现在按钮出现了，这要归功于*ngIf="showButton"最初没有渲染，并且它在模板中声明了一个单击事件处理程序。该处理程序再次更改组件的属性，这次showMessage更改为true.

   <button *ngIf="showButton" (click)="onButtonClick()">Click me!</button>
   
   onButtonClick() {
     this.showMessage = true; …

   Run Code Online (Sandbox Code Playgroud)