ui-sref在父div覆蓋所有嵌套鏈接

我們有一系列的通知，並希望使整個項目可點擊相關項目。這已使用ui-sref實施並正常運行。但是，在此之內，將會有一系列嵌套鏈接轉到其他相關信息。目前的問題是此父母ui-sref覆蓋所有這些鏈接。我已經試過將這些嵌套鏈接作爲標準錨和ui-sref來實現，但它具有相同的效果。所以超鏈接顯示正確，當點擊它時，它會立刻轉到它，然後返回到ui-sref鏈接。ui-sref在父div覆蓋所有嵌套鏈接

這裏是一個代碼示例：

<div class="NotificationItemBalanced"> 
    <div class="notificationItem" ui-sref="community.act({slug: slug, id: id})"> 
     <div class="messageBodyWrapper"> 
      <span class="messageText"><strong><a ui-sref="user.posts({username: username})"></a></strong> commented on your post</span> 
     </div> 
    </div> 
</div>

這是關係到ui-sref還是有在路由來解決這個特定的設置？

感謝

來源

2016-03-07 bnussey

如果這是一個'UI，SREF問題，你可以使用ng-click來攔截點擊，驗證點擊來源並相應地重定向到特定的頁面。 –

就創建這樣一個指令：

myApp.directive('preventBubbling', function() { 
    return { 
     link: function($scope, element) { 
      element.on("click", function(e) { 
       e.stopPropagation(); 
      }); 
     } 
    }; 
});

並將其添加到您的內在聯繫：

<a ui-sref="user.posts({username: username})" prevent-bubbling></a>

基本上，當你點擊一個嵌套的元素，在click事件冒泡到DOM樹。所以我們只是停止傳播。

https://developer.mozilla.org/en/docs/Web/API/Event/stopPropagation

更新

另外，如果你的內在聯繫是從父ui-sref繼承屬性，那麼你應該使用ui-sref-opts還有：

<a ui-sref="user.posts({username: username})" ui-sref-opts="{inherit: false}" prevent-bubbling></a>

來源

2016-03-07 04:07:23

ui-sref在父div覆蓋所有嵌套鏈接

回答

相關問題