angularjs - 将变量传递给指令模板

Question

我想做的是这样的:

<rule-type-selector class="protractor-test-rule-description" all-rule-types="allRuleTypes" local-value="$parent.$parent.currentRuleDescription" on-selection-change="onSelectNewRuleType()" disabled="disabled">
</rule-type-selector>

在指令中

  return {
    restrict: 'E',
    scope: {
      allRuleTypes: '&',
      localValue: '=',
      onSelectionChange: '&',
      disabled: '=' 
    },
    template: function($scope) {
      if($scope.disabled) {
        return '<input type="hidden" disabled>';
      }
      return '<input type="hidden">';
    }

这行不通。无论是否设置了禁用，我总是点击第二个返回语句。 我看过 Passing value of a variable to angularjs directive template function但我的用例似乎有点不同。

Answer 1

您需要在指令的 link 函数中使用 $compile 服务。

您需要一个创建模板的函数(比方说:getTemplate)，然后在您使用的链接函数中:

    element.html(getTemplate(parameter1, parameter2, ...));

然后:

        $compile(element.contents())(scope);

这是应用示例: http://jsfiddle.net/hwndew2o/4/