1

我正在使用一个名为Swiper的第三方库。idangero.us.swiper.js 似乎不能很好地处理保留在 DOM 中的元素指令，因为它假定“幻灯片”元素将是“包装”元素的直接子元素。

来自 idangerous.swiper.js：

for (var i = 0; i < _this.wrapper.childNodes.length; i++) {
    if (_this.wrapper.childNodes[i].className) {
        var _className = _this.wrapper.childNodes[i].className;
        var _slideClasses = _className.split(/\s+/);
        for (var j = 0; j < _slideClasses.length; j++) {
            if (_slideClasses[j] === params.slideClass) {
                _this.slides.push(_this.wrapper.childNodes[i]);
            }
        }
    }
}

有效的 DOM：

<div class="swiper-container">
    <div class="swiper-wrapper">
        <div class="swiper-slide">
            Slide 1
        </div>
        <div class="swiper-slide">
            Slide 2
        </div>
    </div>

无效的 DOM：

<div class="swiper-container">
    <div class="swiper-wrapper">
        <my-custom-slide>
            <div class="swiper-slide">
                Slide 1
            </div>
        </my-custom-slide>
        <my-custom-slide>
            <div class="swiper-slide">
                Slide 2
            </div>
        </my-custom-slide>
    </div>
</div>

我想创建一个myCustomSlide指令来减少样板，集中一些 css 等。为此，我似乎需要从 DOM 中排除我的指令元素，以便实际的“swiper-slide”元素将在_this.wrapper.childNodes. 我查看了指令的替换功能。看起来它完全符合我的要求。但是，它似乎已被弃用。所以我不想使用它。

替换（[已弃用！]，将在下一个主要版本中删除 - 即 v2.0）

现在我正在考虑按优先顺序：

  1. 不使用 my-custom-slide 指令
  2. 提交增强 idangerous.swiper.js 的拉取请求以支持此用例

我更喜欢第三个选项，它是一种不被弃用的 Angular 方式，用于从 DOM 中删除 my-custom-slide 元素。这存在吗？如果它不存在，有人可以解释或指出我为什么不推荐使用替换功能的文档吗？

4

1 回答 1

1

replace已被弃用，因为为了使其正常运行，需要进行大量簿记并考虑极端情况。

如果您有一个特定的用例（就像您所做的那样）并且您知道自定义幻灯片没有什么太花哨的事情，您可以手动将其替换为模板。（如果没有更多详细信息，我无法确定这是否适合您的情况。）

另一种解决方案可能是使用restrict: 'A'.

于 2014-10-04T07:19:20.693 回答