javascript - Angularjs data-ng-click 不会第二次工作......怎么办？

Question

JSP 页面

 <form>
   <table class="countrys" data-name="tableCountry">
    <tr bgcolor="lightgrey">
     <th>Country ID</th>
     <th>Country Name</th>
    </tr>
    <tr data-ng-repeat="c in allCountrys"
     data-ng-click="selectedCountry(c, $index);"
     data-ng-class="getSelectedClass(c);">
     <td>{{c.countryId}}</td>
     <td>{{c.countryName}}</td>
    </tr>
   </table>
 </form>

Controller

$scope.selectedCountry = function(country, index){
angular.forEach($scope.allCountrys,function(value, key) {
      if (value.countryId == country.countryId) {
       $scope.selectedCountry = country;
      }
 });

$scope.selectedRowCountry = index;
}


$scope.getSelectedClass = function(country) {

 if ($scope.selectedCountry.countryId != undefined) {
  if ($scope.selectedCountry.countryId == country.countryId) {
   return "selected";
  }
 }
 return "";
};

CSS

tr.selected {
   background-color: #aaaaaa;
}

我的页面上有这个表格，一旦我按下 1 行，它就会选择它，它会改变颜色，并且它会同时使用这两个功能...

但是一旦我点击另一行，它就不会进入 selectedCountry 函数，而只会进入 sgetSelectedClass 函数

我不知道为什么，我无法选择一行，然后选择另一行，依此类推...所以总是只选择一行

你能帮帮我吗？

Answer 1

您将 $scope.selectedCountry 定义为一个函数，但是当您第一次点击 selectedCountry 时，您通过调用 将 $scope.selectedCountry 作为一个对象>$scope.selectedCountry = country; 在你的 ng-click 函数中。

所以重新定义你的作用域变量。

$scope.selectedCountry = function(country, index){
angular.forEach($scope.allCountrys,function(value, key) {
  if (value.countryId == country.countryId) {
   $scope.selectedCountry = country; // rename this scope variable
  }
});