javascript - AngularJS onClick 按钮。我想改变另一个元素的颜色

Question

我是 Angular 新手。我开发了这样的应用程序

我成功开发了下一个和上一个按钮功能。现在我想写提交按钮。我的想法是，当按下提交按钮时，响应将被捕获并在回答所有问题后最终验证。而且，如果我按下提交按钮，相应的分页选项卡颜色将更改为绿色，就像我参加 1 和 2 意味着前两个选项卡颜色变为绿色。我该如何实现这个。有什么想法吗？

我的 quizcontroller.js

angular.module('app').controller('Quizcontroller',function($scope,updateservice){
   $scope.$watch(function($scope){
   $scope.count=updateservice.getupdate();
   });
   $scope.questions=[
                  {
                  id:1,
                  question:'When a gas is turned into a liquid, the process is called',
                  options: [
                                 {option:'condensation'},
                                 {option:'evaporation'},
                                 {option:'deposition'},
                                 {option:'sublimation'} 
                           ]
                  },
                  {
                  id:2,
                  question:'Which of the following parts of the sun is easily visible only during a total solar eclipse? ',
                  options: [
                                 {option:'core'},
                                 {option:'photosphere'},
                                 {option:'sunspots'},
                                 {option:'corona'}  
                           ]
                  },
                  {
                  id:3,
                  question:'The accumulation of stress along the boundaries of lithospheric plates results in which of the following? ',
                  options: [
                                 {option:'Earthquakes'},
                                 {option:'Magnetic reversals'},
                                 {option:'Hurricanses'},
                                 {option:'Increased deposition of deep-sea sediments'}  
                           ]
                  },
                  {
                  id:4,
                  question:'Pollination by birds is called ',
                  options: [
                                 {option:'autogamy'},
                                 {option:'ornithophily'},
                                 {option:'entomophily'},
                                 {option:'anemophily'}  
                           ]
                  }
             ];
       updateservice.settotal($scope.questions.length)
       $scope.next=function($scope){
       var val=updateservice.getupdate();
       updateservice.setupdate(val<updateservice.gettotal()-1?++val:0);
        },
       $scope.prev=function($scope){
       var val=updateservice.getupdate();
       updateservice.setupdate(val>0?--val:updateservice.gettotal()-1);
         }
         })

Answer 1

向您的示波器添加一个“标志”，表明它是否应该改变颜色:

$scope.flag = false;

$scope.clickedButton = function() {
    // some conditions
    if(itIsTrue) {
        $scope.flag = true;
    }
}

html:

<button ng-click="clickedButton()">Click me!</button>

<button ng-class="{ green: flag }">MyButton</button>

CSS:

.green {
    background-color: green;
}