Question

我将第三方指令包装为角度指令。我们称之为<wrapper>。我必须。

在模板中，我在<wrapper>上有一个条件类，看起来像这样：

<div ng-class="{'conditional-class':conditionalClassBoolean}">
    <element-to-wrap
        ng-class="ngClass"
        other-attributes ... >
    </element-to-wrap>
</div>

内部元素也有ng-class属性。它应该从包装器的范围中接收它的类。

该指令看起来像这样：

angular...directive('wrapper', function() {
    return {
        restrict: 'E',
        scope: {
            ng-class: '@'
        },
        ...
    };
});

这很好，直到我将条件类引入我的模板。它也可以很好地工作，因为我没有将类传递给包装器，因此它将被传递给内部元素...

以下代码有效：

<wrapper ... ></wrapper>

以下代码不起作用：

<wrapper ng-class="apply-this-on-the-inner-element" ... ></wrapper>

我收到以下错误：

Error: [$parse:syntax] Syntax Error: Token '{' is an unexpected token at ...
of the expression [apply-this-on-the-inner-element {'conditional-class':conditionalClassBoolean}]

似乎有角度列出所有＆＃34;类＆＃34;已经通过ng-class传入的，但这是在它评估是否应该应用条件类之前发生的。有办法解决这个问题吗？

我也尝试用逗号和分号分隔。它没有应用于内部元素。只有错误消息消失了。

更新（截至1月17日）

似乎我能够以简化的JSFiddle重现该问题。

基本上，有一个指令（tobe wrapped），它不会替换它的容器标签。比，有包装指令，它确实。

这就是我最终获得[ {a} {b} ]和[ a {b} ]类别列表的方式。

仍然想知道那里是一个可选的解决方案还是我在这里做了一些完全错误的事情。

将元素包装为角度指令时出现ng-class问题

0 个答案: