Question

我正在学习角度，我正在为此制作一个测试应用程序。我找到了一个基于jquery和google材料颜色托盘的非常好的“用户卡”设计，我想迁移它并从中创建一个组件。

可以在此处找到这些卡片 - https://github.com/marlenesco/material-cards

我在想 - 这样做的最简洁过程是什么？我应该包括什么以及在哪里？我应该在哪里添加与该项目相关联的javascript

Answer 1

看起来jQuery在codepen中做得非常多，所以你可能完全忘记了它。您可以使用@ViewChild和ElementRef来获取DOM元素以进行操作，而不是使用jQuery选择器。

我的第一步是创建一个Card组件，所以你的所有JS（TS？）只相对于一个实例。

在JS中添加和删除类的部分内容中，您可以直接在模板中使用[ngClass]，并将其条件基于您在组件TS中设置的值。

最后，例如：

window.setTimeout(function() {
    icon
      .removeClass('fa-arrow-left')
      .removeClass('fa-spin-fast')
      .addClass('fa-bars');

  }, 800);

可以使用Observable.timer(800).subscribe(() => { // do stuff... (like update your ngClass conditions) }处理。

当然，有很多不同的方法来转换它，但这将是一个不错的开始。

我现在还没有时间，但是如果你今天晚上还没来，我可能有时间去做一个干净的转换解决方案。

快乐的编码！

将基于jquery的组件转换为角度2/4组件？

1 个答案: