0

我目前正在学习 AngularJS，并且已经开始了一个小项目，这基本上是我的一个较旧的项目，用 jQuery 完成。

到目前为止一切都很好，但最后几个小时我把头绕在了这个区域。当时在 jQuery 中 5​​ 分钟，但我不知道 AngularJS 中最好的方法是什么）

这是我的 jQuery：日历视图。它在点击时打开和关闭天数。每天单击一次，它就会获得课程opened。还有一个州locked，我根本无法打开这一天。

$('.mod-item').on('click', function(){
        if ($(this).find('.mod-item-day').not('.locked')) {
            if($(this).find('.mod-item-day').hasClass('open')){
                $(this).find('.mod-item-day').removeClass('open').addClass('opened');
            }else{
                $(this).find('.mod-item-day').addClass('open');
            }
        }
});

这是标记：

<ul class="mod">
    <li class="mod-item">
        <div class="mod-item-day opened"><span>1</span></div>
        <div class="mod-item-content">
            <img src="../images/present1_late.jpeg" alt="">
        </div>
    </li>

所以我的问题是 - AngularJS 最常用的方法是什么？

4

1 回答 1

3

您基本上按照Angular 网站上的待办事项示例中显示的方式执行此操作。

  1. 在当天div，指定ng-click="callbackInYourScopeCode()"。在 To Do 示例中，它是ng-click="archive()"

  2. 在当天的div'sclass中，包含模型中的属性。例如，在 To Do 示例中，有<span class="done-{{todo.done}}">{{todo.text}}</span>. 注意属性todo.done。

  3. 在您的范围代码中，让函数 ( callbackInYourScopeCode) 更改模型的属性（done在 To Do 示例中）。

Angular 将调用您的范围代码以响应单击，然后根据模型的更改更新元素。

于 2013-05-30T08:30:31.857 回答