有条件的 ui-sref 和 ng-click 相同的链接答案

【问题标题】：Conditional ui-sref and ng-click on same link有条件的 ui-sref 和 ng-click 相同的链接
【发布时间】：2016-09-24 12:23:17
【问题描述】：

我在指令中有一个链接，目前看起来像这样：

<a href="" ng-href="{{tile.type === 'article' ? '/article/' + tile.slug : ''}}" ng-click="tile.type === 'video' && openVideo({id: tile.videoId})"></a>

这里的逻辑是这样的： - 如果tile.type 是article，链接应该创建一个href 值，如果点击应该转到这个相关的url - 如果tile.type 是video，则链接应将href 值留空并在单击时执行openVideo 函数

问题是，对于视频链接，href 值被完全删除，因此链接失去了原生链接样式，例如鼠标光标在悬停时发生变化。我也更喜欢使用ui-sref 而不是ng-href，但我似乎无法让条件语句在其中起作用。

这样做的正确方法是什么？

【问题讨论】：

标签： javascript html angularjs angular-ui-router

【解决方案1】：

只需使用 ng-if:

<a ng-if="tile.type === 'article'" ng-href="{{'/article/' + tile.slug}}"></a>
<a ng-if="tile.type === 'video'" href="" ng-click="openVideo({id: tile.videoId})"></a>

你也可以使用 ui-sref

【讨论】：

这样，我将不得不重复我放在链接中的任何不理想的内容。

【解决方案2】：

选项 1：仅使用 ng-click 并通过 $state.go 在 ng-click 函数中处理链接。

选项 2：使用https://christopherthielen.github.io/ui-router-extras/#/sticky 为视频制作合成并行路由或在 $stateChangeStart 中拦截视频路由更改（打开视频并防止状态更改）。

【讨论】：