javascript - 如何按类名选择元素并遍历angularJs中的那些对象？

Question

我是 angularJs 的新手，我在我的 Angular Controller 中有一个函数

$scope.addPrimaryClass = function () {
        var weekDayBtn = $(".weekdayButton");
        weekDayBtn.addClass("btn-white").removeClass("btn-primary");
        $.each(weekDayBtn,function (index) {
            if($(this).val()==$scope.weekly){
                $(this).addClass("btn-primary").removeClass("btn-white");
            }
        })
    };

在我看来:

<div class="btn-group">
                        <button class="btn btn-white weekdayButton" type="button" value="7" ng-click="weekdayClicked($event);">Sun</button>
                        <button class="btn btn-white weekdayButton" type="button" value="1" ng-click="weekdayClicked($event);">Mon</button>
                        <button class="btn btn-primary weekdayButton" type="button" value="2" ng-click="weekdayClicked($event);">Tue</button>
                        <button class="btn btn-white weekdayButton" type="button" value="3" ng-click="weekdayClicked($event);">Wed</button>
                        <button class="btn btn-white weekdayButton" type="button" value="4" ng-click="weekdayClicked($event);">Thu</button>
                        <button class="btn btn-white weekdayButton" type="button" value="5" ng-click="weekdayClicked($event);">Fri</button>
                        <button class="btn btn-white weekdayButton" type="button" value="6" ng-click="weekdayClicked($event);">Sat</button>
                    </div>

addPrimaryClass 中的代码在控制台中按要求工作，因为我可以在那里使用普通的 jquery，但代码本身在 angular 中不起作用。基本上，我想根据范围值之一更改按钮的 css。请帮忙!!!

Answer 1

您可以使用 ng-class 指令根据范围变量是什么来应用类。例如:

<button class="btn weekdayButton" type="button" value="7" ng-click="weekdayClicked($event);" ng-class="($(this).val()==$scope.weekly) ? 'btn-primary' : 'btn-white'">Sun</button>

ng-class 指令有多种使用方式。请查看文档并确定最适合您的内容:https://docs.angularjs.org/api/ng/directive/ngClass

---

另外，您可能希望从 Angular 代码中删除所有 jQuery :)