Angularjs 如何在控制器中使用元素？

我正在完成指令方面的代码学院挑战，我想知道如何编写指令中但控制器中的函数。该指令使用元素。如何在控制器中使用元素？我理解angular反对在控制器中进行任何dom操作，而不是依赖于指令。为什么呢

这是定义指令的HTML：

<div class="main" ng-controller="MainController">
   <div class="container">
      <div class="card" ng-repeat="app in apps">
        <app-info info="app"></app-info>
        <install-app></install-app>
       </div>
    </div>
</div>

我已尝试在控制器中添加以下内容：

$scope.buttonText = "Install",
$scope.installed = false,
$scope.download = function ($element){
  if($scope.installed) {
    $scope.buttonText = "Install";
    $scope.installed = false;
  } else {
    $scope.buttonText = "Uninstall";
    $scope.installed = true;
  }
};

---

但当我单击“安装”时，它将所有按钮更改为“卸载”，而不是单击的单个按钮。

如果您只想根据

范围切换按钮元素上的类。installed

值为true或false，您可以使用指令

ng-class="{'ClassName':expressionValue}"

ng-class="{'ClassName':expressionValue}"