javascript - 由于某些未知原因，无法在 AngularJS 部分中绑定(bind) html？

Question

我有一个 ng-repeat，它使用部分 html 文件循环显示项目到页面，出于某种原因，部分内的变量不显示但是变量 {{rule.name}} 显示在外部部分显示正常吗？

规则是一个数组，例如rules[0].name = '我的第一条规则';rules[0].desc = '我的第一个 desc';rules[1].name = '我的第二条规则';rules[1].desc = '我的第二个 desc';

<div ng-controller="RulesController" ng-if="hasManageRules" class="roles canvas-column">
<div ng-repeat="(ruleIndex, rule) in rules">
    {{rule.name}} // this shows the variable fine 
    <div ng-include src="'templates/partial/rule.html'"></div>
</div>

//我的 partial/rule.html 文件:

<div ng-controller="RuleController" class="card-body no-hover form-group" ng-click="unfoldrule(ruleIndex)" ng-class="{'unfolded': rule.unfolded}">
<ng-form name="ruleForm">
    <div class="card-header">
        <div class="card-title" ng-if="!rule.unfolded" ng-bind-html="rule.name"></div>

谁能建议为什么 rule.name 变量出于某种原因不显示在 ng-bind-html 上？

Answer 1

你不必在里面给 ng-controller="RuleController"rule.html 文件。