在 Angular2 中，mailto link 被识别为组件路由

Question

我正在尝试在 Angular 项目中创建一个 mailto link。但不是开放前景。 Angular 将其作为组件路由拾取。我该如何解决这个问题？

当我尝试以下代码时：

<a [href]="mailto:myName@myDomain.com">myName@myDomain.com</a>

当我点击 link 时，我被路由到一个未定义的页面。并得到以下错误信息：

ERROR Error: Uncaught (in promise): Error: Cannot match any routes. URL Segment: 'null'
Error: Cannot match any routes. URL Segment: 'null'
    at ApplyRedirects.push../node_modules/@angular/router/fesm5/router.js.ApplyRedirects.noMatchError (router.js:2469)
    at CatchSubscriber.selector (router.js:2450)
    at CatchSubscriber.push../node_modules/rxjs/_esm5/internal/operators/catchError.js.CatchSubscriber.error (catchError.js:34)
    at MapSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber._error (Subscriber.js:80)
    at MapSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber.error (Subscriber.js:60)
    at MapSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber._error (Subscriber.js:80)
    at MapSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber.error (Subscriber.js:60)
    at MapSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber._error (Subscriber.js:80)
    at MapSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber.error (Subscriber.js:60)
    at TapSubscriber.push../node_modules/rxjs/_esm5/internal/operators/tap.js.TapSubscriber._error (tap.js:61)
    at resolvePromise (zone.js:831)
    at resolvePromise (zone.js:788)
    at zone.js:892
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:423)
    at Object.onInvokeTask (core.js:17290)
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:422)
    at Zone.push../node_modules/zone.js/dist/zone.js.Zone.runTask (zone.js:195)
    at drainMicroTaskQueue (zone.js:601)```

Answer 1

[href]="mailto:myName@myDomain.com"

此语法 <[]> 用于数据绑定，因此 angular 尝试将 "mailto:myName@myDomain.com" 解析为变量。你应该像下面这样尝试

<a href="mailto:myName@myDomain.com">myName@myDomain.com</a>

Answer 2

您的 html 应如下所示：

<a href="mailto:myName@myDomain.com">myName@myDomain.com</a>

请注意，href 属性周围没有 []。当您将属性包装在 [] 中时，它需要一个变量。

如果出于某种原因，您仍想使用绑定，您可以将值作为字符串传递：

<a [href]="'mailto:myName@myDomain.com'">myName@myDomain.com</a>

在 Angular2 中，mailto link 被识别为组件路由

In Angular2 mailto link is recognized as component route

mailto

angular