Question

有人可以指出我如何进行有条件的href而不是复制标签来进行隐藏/显示。

这是我在这里尝试做的事情，如果DisplayLocation为null，则使用＆＃34; unknown＆＃34;否则使用该位置。我试过像x这样的东西？ y：＆＃34;未知＆＃34;但我认为这不适用于href。

<a class="btn-main orange" data-ng-href="#!/movie-details/
   {{movie.Item.DisplayLocation ? 
       movie.Item.DisplayLocation : 'unknown' | prettify}}/
   {{movie.Item.JobTitle | prettify}}/
   {{movie.Item.Id}}" 
   id="view--{{$index}}">View
</a>

修正：

{{1}}

Answer 1

您可以在控制器中创建一个函数，然后在绑定中使用该函数。

控制器：

$scope.returnConditionalDisplayLocation = function returnConditionalDisplayLocationFn() {
    return $scope.movie.Item.DisplayLocation ? 
           $scope.movie.Item.DisplayLocation : "unknown";
}

HTML：

<a class="btn-main orange" 
   href="#!/movie-details/{{returnConditionalDisplayLocation() | prettify}}/
   {{movie.Item.Title | prettify}}/{{movie.Item.Id}}" id="view--{{$index}}"> View
</a>

这样您就可以将逻辑分离到它所属的控制器中，同时清理HTML！

编辑：

现在可以使用href但是如果用户在有角度有时间为href呈现绑定值之前点击链接，那么他们将会收到错误的网址。

因此，您希望每Angulars Documentation

使用ng-href

以与上述相同的方式，你会写：

<a class="btn-main orange" ng-href="#!/movie-details/
   {{returnConditionalDisplayLocation() | prettify}}/
   {{movie.Item.Title | prettify}}/{{movie.Item.Id}}" 
   id="view--{{$index}}"> View
</a>

Answer 2

将所有内容移动到一个表达式中，并将过滤器作为子表达式处理。然后，您可以以非常小的占地面积获得您想要的东西，并且不会使控制器混乱：

<a class="btn-main orange" href="#!/movie-details/{{ !movie.Item.DisplayLocation ? 'unknown' : ((movie.Item.DisplayLocation | prettify) + '/' + (movie.Item.Title | prettify) + '/' + (movie.Item.Id)) }}" id="view--{{$index}}">View</a>

额外的括号是可选的，但在我看来增加了清晰度。正如ryanyuyu所指出的那样，使用ng-href来防止未经解析的内容的闪现。

angularjs条件href

2 个答案:

控制器：

HTML：

编辑：