Question

我有一个包含大量jQuery DOM操作代码的页面，我需要将它全部转换为Angular。大多数jQuery代码都是关于调整元素大小和设置类和css属性。我有点不知所措，需要有关如何将jQuery转换为Angular代码的建议。重要提示：jQuery根本不处理业务逻辑。

以下是我需要转换的jQuery代码示例：

var globals = {};

function init()
{
    globals.topNavHeight = $('.x').height() + $('.y').height();
}

function adjustSomeStuff()
{
    $('.topNav').css('height', globals.topNavHeight);
    $('.bottomFooter').css('someRandomProperty', $('#someHelperDomElem').css('height'));
    $('.anyOtherRandomElementOnPage').css('color', '#012345');
    globals.savedData = 1000;
}

$(window).bind('resize', adjustSomeStuff);
$(window).bind('load', init);

我的问题是，我知道我不知何故需要将这些函数转换为指令，但它们只是使用来自整个页面的绝对随机元素来进行不同的计算和处理。我应该抛出这段代码并从头开始编写指令，还是可以以某种方式使用现有的jQuery代码？

Answer 1

根据窗口大小调整主页面项目大小的特定代码块，我认为可以保留在jquery中。在angular中你可以根据不同的数据属性定义例如css类（通过ng-class），但它看起来不像你在做什么。

但是，您应该转到css类的颜色变化，您应该根据应用程序流在运行时切换css类。就像我以前写过的那样，可以通过ng-class进行角度化（例如ng-class =＆＃34; {＆＃39; warning＆＃39;：（issuesFound＆gt; 5），＆＃39;有效＆＃39; :( issuesFound == 0）.....

将jQuery代码转换为Angular

1 个答案: