条件设置 angular/nativescript nsRouterLink答案

【问题标题】：conditional set angular/nativescript nsRouterLink条件设置 angular/nativescript nsRouterLink
【发布时间】：2017-04-21 12:03:37
【问题描述】：

是否可以仅在特定条件为真时设置nsRouterLink？

假设，我有一个列表视图，每个项目都有自己的nsRouterLink 到详细信息页面。但是列表中的某些项目没有详细信息所需的 id，因此它们不应该是可点击的，而其他项目应该是不可点击的。

我知道我可以只使用 onClick 绑定并自行处理它，但 nsRouterLink 也可以自动处理吗？

例如：

<StackLayout *ngFor="let item of items">
    <StackLayout [nsRouterLink]="['/path/' + item.id]">
        <!-- Content goes here -->
    </StackLayout>
</StackLayout>

【问题讨论】：

你可以尝试可切换的绑定，它应该与 nsrouterlink 一起使用
我或多或少是 Angular 的新手，请问您可以添加一个示例吗？
[nsRouterLink]="<value to check> ? '<value if true>' : '<value if false>' "
查看stackoverflow.com/questions/42578109/… 示例
问题是，如果条件为假，根本就没有链接。

标签： javascript angular nativescript angular2-nativescript

【解决方案1】：

我看过几次的这个解决方案是什么：

<StackLayout *ngFor="let item of items">
    <StackLayout [nsRouterLink]="[item?.id ? '/path/' + item.id : false]">
        <!-- Content goes here -->
    </StackLayout>
</StackLayout>

【讨论】：

当我将它设置为返回 null 而不是 false 时，它对我有用
它对我来说根本不起作用，如果我给出 false 或 null 则会引发错误。

【解决方案2】：

我没有太多使用nsRouterLink。但是，当您将链接保留为 null 或 undefined 时会发生什么？

如果你真的在点击事件上处理链接，那么有条件地监听事件应该在代码端完成，也就是组件。

另一种选择是显示 2 个不同的组件。如果详细，请显示 nsRouterLink 没有细节，显示标签。

类似的东西也可以工作。

【讨论】：

你有没有想过“没有数据可显示”之类的通知？
我猜，这可以在细节组件而不是列表本身中处理...

【解决方案3】：

使用 isEnabled 属性，如果不允许用户转到下一页，它将禁用按钮

<Button [isEnabled]="<value to check>" text="<Text>" [nsRouterLink]="['/<link>']"></Button>

【讨论】：

它不是一个按钮，它是一个围绕项目内容的整个 StackLayout。我想，我应该把这个添加到问题中。
如果你使用 ngfor，你不能做你想做的事，至少不容易
你是什么意思，你说的问题分别是什么？
如果你将stacklayout的[isEnabled]=""绑定到一个值，所有的布局将同时被启用或禁用
所以你的批评者更关心你的答案而不是我的需要^^这只是设置一个属性或将其排除在元素标签之外