AngularJS ng-bind-html с переменной в нем

Question

Я новичок в AngularJS. У меня есть таблица HTML, как показано ниже:

<table>
<thead>
<tr>
    <th>ID</th>
    <th>other stuff</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="rule in rules">
    <td>@{{ rule.id }}</td>
    <td ng-init="functionThatExecutesHttpPost(rule.id)" ng-bind-html="variable"></td>
</tr>
</tbody>
</table>

Угловая функция выглядит так:

$scope.functionThatExecutesHttpPost = function(ruleId) {
    $http.post('***'+ruleId).success(function(data) {
        $scope.variable = data;
    });
}

Проблема, которую я сейчас испытываю, заключается в том, что данные, которые я хочу иметь в моем HTML-представлении, находятся в каждом "td", а не только в том, что имеет правильный ID. Немного подумав, это поведение, которое вы могли ожидать.

Мой вопрос сейчас:
Можно ли дать этому ng-bind-html переменную типа -> variable(rule.id), а затем в функцию Angular я напишу что-то вроде -> $scope.variable(ruleId) = data;
Или есть другой подход к этой проблеме?

Заранее спасибо.

Answer 1

Лучшим решением было бы загрузить шаблон с помощью ng-include директива, если вы не хотите выполнять какие-либо операции. Он загрузит требуемый шаблон внутри этого тд, как вы делали это из ajax.

наценка

<tr ng-repeat="rule in rules">
    <td>@{{ rule.id }}</td>
    <td ng-include="'******'+ rule.id"></td>
</tr>

Закодированный URL остается в одинарных кавычках, а другие динамические ng-repeat текущая переменная приходит как есть путем объединения с + знак.