Question

我需要为指令提供一个可选参数，该参数可用于包围指令的模板。这是我所拥有的基本例子：

angular
    .module('test')
        .directive('dropdownField', dropDownFn);

    function dropDownDirective Fn(termParameters, restService) {
        return {
            scope: { 
                'markup' : "=?"
            },
            bindToController: true,
            controllerAs: "vm",

            templateUrl: "dropdown.tpl.html",
            controller: function ($scope, $element, $attrs) { ... }
        }
    }

HTML可能如下所示：

    <dropdown-field
        markup="<div class='thisIsTheSurroundingMarkup'></div>"
    ></dropdown-field>

或者这个：

    Inside the controller:
    $scope.thisIsTheSurroundingMarkupFromTheController = "<div class='thisIsTheSurroundingMarkup'></div>";

    <dropdown-field>
      {{ thisIsTheSurroundingMarkupFromTheController }}
    </dropdown-field>

两者都会/应该产生以下结果：

    <div class='thisIsTheSurroundingMarkup'>
        <select ...>...</select> <-- this comes from dropdown.tpl.html 
    </div>

我想这是一个有ngTransclude的，但是，我不知道如何。有人能指出我正确的方向吗？非常感谢！

Answer 1

可以自己解决这个问题。

        compile: function compile(tElement, tAttrs) {
            tElement.wrap(tAttrs.markup);
        },

Angular：在其参数的一个标记中嵌入一个指令模板

1 个答案: