1

我尝试使用动态模板制作指令

app.directive('boolInput', function () {
  'use strict';

  var
    restrict = 'E',
    replace = true,
    template = '<ng-include src="template"></ng-include>',
    scope = {
        value: "=",
        template: "@"
    },
    link = function (scope, element, attributes) {
        // some stuff
    };

  return {
    link: link,
    restrict: restrict,
    replace: replace,
    template: template,
    scope: scope,
    transclude: true
  };
});

所以我用

template = '<ng-include src="template"></ng-include>'

scope = {
        //..
        template: "@"
    }

通过属性传递模板 url。一切都很好,而不是一件事。我是如何使用指令的:

<bool-input data-value="item.value" data-ng-repeat="item in source" data-  template="templates/boolInput.html">
    {{item.Text}}
</bool-input>

{{item.Text}} - should be transcluded into template

该模板:

<div class="checkbox">
    <label class="checkbox-custom" ng-transclude>
        <input type="checkbox">
        <i class="icon-unchecked checked"></i>
    </label>
</div>

但这不会发生,结果我看到:

<ng-include src="template" data-value="item.value" data-ng-repeat="item in data" data-template="templates/boolInput.html" class="ng-scope"><div class="checkbox ng-scope">
    <label class="checkbox-custom" ng-transclude="">
        <input type="checkbox">
        <i class="icon-unchecked checked"></i>
        <!-- There should be the text -->
    </label>
</div></ng-include>
4

1 回答 1

0

这是 2 年前... 现在我们可以将属性传递给 templateUrl 函数

templateUrl: function (elememt, attrs) { return attrs.template || '<some default template path>'; }

于 2015-09-26T19:02:51.570 回答