Question

我正在使用ng-repeat来迭代表的行

 <td ng-repeat=" (col,row) in rows" ng-if=="col?'IP_ADDRESS' row:'<a>row</a>'">
            {{row}}
 </td>

我正在寻找的是当col值是IP_ADDRESS时，＆＃39;行＆＃39;应该用锚标签包裹返回。这是否可能

样本数据

{"IP_ADDRESS":"10.10.10.10","MACHINE":"mymachine"}

Answer 1

您错误地使用ng-if。如果条件是真实的，ng-if将插入其应用的元素HTML，否则它将删除它。它不会将内容注入现有HTML。

所以也许（未经测试）

<td ng-repeat="(col,row) in rows">
    <a ng-if="row === IP_ADDRESS" >{{row}}</a>
    <span ng-if="row !== IP_ADDRESS" >{{row}}</span>
 </td>

请参阅文档：https://docs.angularjs.org/api/ng/directive/ngIf

Answer 2

也许ngBindHtml正是您所寻找的。

<td ng-repeat="(col,row) in rows">
    <span ng-bind-html="getHtml(row,col) | to_trusted"></span>
</td>

在你的* .js

中

var myApp = angular.module('app', []);

myApp.filter('to_trusted', ['$sce', function($sce){
    return function(text) {
        return $sce.trustAsHtml(text);
    };
}]);

myApp.controller('ctrl', ['$scope', function($scope) {
    $scope.getHtml = function(row, col) {
      return col == "IP" ? '<a href="">' + row + '</a>' : row;
    };
}]);

通过这种方式，您可以更好地控制HTML的编辑。

Answer 3

<td ng-repeat=" row in rows">
        <div ng-if="row == 'IP_ADDRESS'">{{row.yourValue}}</div>
        <div ng-if="row != 'IP_ADDRESS'">{{row.yourOtherValue}}</div>
</td>

内部＆＃34; yourValue＆＃34;你的锚标签可以定义。我没有＆＃34;行＆＃34;所以我试图简化逻辑。希望它有所帮助;）

在角度js中条件ng-repeat

3 个答案: