Question

我正在尝试在github上使用这个有角度的幻灯片切换指令：https://github.com/EricWVGG/AngularSlideables

它说它支持像id =“foo _ {{$ index}}”这样的动态ID，但它没有提供一个有效的例子。我尝试制作一个，我得到一个未捕获的TypeError：无法读取属性'querySelector'的null

我知道typeError与脚本之前的jQuery加载有关，但由于这个角度处理jQuery，我不知道如何让这个人代码做它应该做的事情。

<ul>
    <li ng-repeat="row in data">
        <span slide-toggle="#row_{{$index}}" >expand row #{{$index}}.</span>
        <div id="row_{{$index}}" class="slideable">
            <p>How are YOU doing?</p>
        </div>
    </li>
</ul>

我控制错误的动态模块：http://jsfiddle.net/3sVz8/486/

如果这可行，我还需要它使用类似id =“foo _ {{item.id}}”而不是典型的$ index

Answer 1

您的错误不是因为您的身份，而是因为您没有定义什么＆＃34; target＆＃34;是....

    element.bind('click', function() {
        var content = target.querySelector('.slideable_content');
        if(!attrs.expanded) {
            content.style.border = '1px solid rgba(0,0,0,0)';
            var y = content.clientHeight;
            content.style.border = 0;
            target.style.height = y + 'px';
        } else {
            target.style.height = '0px';
        }
    attrs.expanded = !attrs.expanded;
});

当您设置var内容时，目标不会在任何地方传递或定义。您想要事件目标吗？您必须将事件传递给您的回调函数才能访问它。即使如此，为了使用querySelector，您必须将目标定义为文档（var target = document），因为querySelector是文档对象的方法。

Read more about querySelector第一句话全部说明＆＃34;返回文档中的第一个元素＆＃34;，这意味着你总是使用querySelector document.querySelector(selectors);

slideables queryselector错误与动态ID

1 个答案: