css - angularjs 中的类型错误

Question

我试图将列表中的某些值标记为字体红色，并根据某些条件保留默认值。当我尝试为列表中的特定数据分配 bool 变量时，我会收到“类型错误:无法分配给只读 123 的属性“匹配”；我的代码:

angular.forEach($scope.searchResults, function (value, index) {

  //populate searchResults
   $scope.searchResults[index].name = "ABC";
  
    $scope.searchResults[index].linkedRecords = [];
  if(//check some condition){
    $scope.searchResults[index].linkedRecords[i] ="123"; 
    $scope.searchResults[index].linkedRecords[i].match=true;
  }
    
  
  });

 <tr data-ng-repeat="searchResult in searchResults ">
   
   <td >
            <span data-ng-repeat="source in searchResult.linkedRecords" >
                <span ng-if="!source.match">{{ source }}</span>
                <span ng-if="source.match" style="color: red">{{ source }}</span>
                <br>
            </span></td>
   </tr>

知道如何在 html 中完成这项工作吗？我需要为每个元素设置一些内容，并使列表中的这些元素显示为红色。

Answer 1

您正在将属性设置为 123 的值，然后您正在尝试访问名为 'match' 的属性。

$scope.searchResults[index].linkedRecords[i] = 123;

此时$scope.searchResults[index].linkedRecords[i]的值为123。

这意味着这一行:

$scope.searchResults[index].linkedRecords[i].match=true;

相当于:

(123).match = true;

这行不通，因为 Number 类型是不可变的，这意味着您不能在其直接对象表示上添加或修改属性。

---

您可能希望将您的号码包裹或装箱到一个对象中。然后您可以向该对象添加其他属性。

$scope.searchResults[index].linkedRecords[i] = { value: 123, match: true };

那么您的 HTML 将看起来像这样。

<span data-ng-repeat="source in searchResult.linkedRecords" >
  <span ng-if="!source.match">{{ source.value }}</span>
  <span ng-if="source.match" style="color: red">{{ source.value }}</span>
  <br>
</span>