<a> 标签在 AngularJS 中不起作用

Question

我使用 angular 和 jquery 将事件日历放在一起。一个样式化的按钮显示 +My Schedule 将数据添加到 localStorage，然后将其拉入另一个页面以供用户参考。 localStorage 函数运行良好，直到它被引入 Angular 模板。现在单击链接会导致页面跳转，并且控制台或 localStorage 中没有任何记录。 我正在尝试做的一个工作示例是在以下 url，这个页面都是硬编码的，我试图在 Angular 模板中实现相同的东西：http://events.latimes.com/festivalofbooks/the-festival/schedule/ 任何帮助，将不胜感激。 这是一个小提琴：http://plnkr.co/edit/gaKFWTsACxwCg0i4JCiw?p=preview 这是缩短的模板，因为我必须在此处粘贴代码：

 <table class="target-stage stage-only" border="0" cellspacing="0" 
 cellpadding="0" style="border:none;" > 
      <tr>
        <td width="190" valign="top" class="ev-time">{{item.time}}</td>
        <td valign="top" class="ev-desc">
        <p class="ev-date">{{item.day}}, {{item.date}}, 2015</p>
        <strong>{{item.first_name}} {{item.last_name}},</strong> Author of 
 <em>" {{item.work_title}}"</em><br />
        {{item.stage}}
        <span class="info-btn"><p class="selctor" rel={{item.rel}}><span     
 class="addSchd"><a href="#"><b>+ MY SCHEDULE</b></a></span>
        </td>
      </tr>
 </table>

Answer 1

我在这里看到了一些问题。 首先，您的 html 已损坏。 p-tag 永远不会关闭。

<span class="info-btn"><p class="selctor" rel={{item.rel}}><span class="addSchd"><a href="#"><b>+ MY SCHEDULE</b></a></span>

其次，据我快速浏览，您正在动态添加内容。您不能在动态内容上使用 (selector).click()，因为在调用代码时选择器将不存在。而是使用 on()，它将被应用于动态生成的内容，如下所示：

$(document).on("click", ".button", function() {
    // do this when class with .button is clicked
});