对于Angular空路由器链接感兴趣的读者，本文将提供您所需要的所有信息，我们将详细讲解angular路由配置，并且为您提供关于Angular2–通过路由器链接将对象从一个组件发送到另一个组件、Ang
对于Angular 空路由器链接感兴趣的读者，本文将提供您所需要的所有信息，我们将详细讲解angular路由配置，并且为您提供关于Angular 2 – 通过路由器链接将对象从一个组件发送到另一个组件、Angular 2路由器在路由时刷新页面、angular2 – Angular 2.0路由器不工作重新加载浏览器、Angular2路由器(@角/路由器),如何设置默认路由？的宝贵知识。
本文目录一览：- Angular 空路由器链接（angular路由配置）
- Angular 2 – 通过路由器链接将对象从一个组件发送到另一个组件
- Angular 2路由器在路由时刷新页面
- angular2 – Angular 2.0路由器不工作重新加载浏览器
- Angular2路由器(@角/路由器),如何设置默认路由？
Angular 空路由器链接（angular路由配置）
如何解决Angular 空路由器链接？
在 angular 11 中，我正在动态渲染导航组件。所以有这样的代码：
<li [routerLinkActive]="active">
<a [routerLink]="navItem.route">navItem.linkText</a>
</li>
这很好，除非我有一个导航部分，它实际上不是一条路线，而是触发子项打开。我仍然希望 routerLinkActive 正确应用该类，但我不希望它在任何地方导航。
路由值为空，但这不起作用，所以我尝试将其设置为一个空数组，如下所示：
<li [routerLinkActive]="active">
<a [routerLink]="navItem.route ? navItem.route: []">navItem.linkText</a>
</li>
但空数组被解释为链接到我的主页，因此在初始渲染时主页链接被突出显示，但任何具有空路由的子项目也是如此。
有没有一种方法可以像我一样动态地创建一个 angular 导航，让 routerlinkactive 指令正确应用该类，但链接实际上不会在任何地方导航？
解决方法
这应该有效：
<li [routerLinkActive]="active">
<a [routerLink]="navItem.route ? navItem.route: undefined">navItem.linkText</a>
</li>
Angular 2 – 通过路由器链接将对象从一个组件发送到另一个组件
我为我的人阵列中的每个人对象创建一个人物配置文件组件,并将其显示在我的屏幕上.
<div *ngFor="#person of people; #i = index">
<person-profile [person]="person"></person-profile>
</div>
person-profile组件显示person对象中包含的几条信息.我试图使用路由器链接将人物对象组件中的整个人物对象发送到名为“map”的组件,并将人物对象作为参数传递.
<person-profile>
..code..
<tr>
<td>Address</td>
<td>{{ person.visiting_address }}</td>
<td *ngIf="person.visiting_address"><a [routerLink]="['Map',{person:person}]">View on map</a></td>
</tr>
..code..
<person-profile>
在我的地图组件中,我检索对象：
var person = <any> routeParams.get('person');
问题是我每次都在地图组件中得到同一个人,无论哪个< person-profile>我执行路由器链接.它始终是人民名单中的第一人.奇怪的是,如果我传递来自person对象的特定参数,它就可以工作.例如,如果我传递person.family_name而不是整个person对象,一切正常,但我想发送整个对象.有什么建议？
谢谢！
解决方法
我的建议是传递一个ID并在允许按ID获取具体实例的服务中共享用户.
Angular 2路由器在路由时刷新页面
我的索引文件,
<!--... . . varIoUs scripts and styles . . . . . --->
<script src="node_modules/angular2/bundles/angular2.dev.js"></script>
<script src="node_modules/angular2/bundles/router.dev.js"></script>
<script src="node_modules/angular2/bundles/http.dev.js"></script>
<script>
System.config({
packages: {
app: {
format: 'register',defaultExtension: 'js'
}
}
});
System.import('app/main')
.then(null,console.error.bind(console));
</script>
</head>
<body>
<app></app>
</body>
应用来源,
main.ts
import {bootstrap} from 'angular2/platform/browser';
import {RoutingApp} from './routing/routing.app'
import {ROUTER_PROVIDERS} from 'angular2/router'
bootstrap(RoutingApp,[ROUTER_PROVIDERS]);
RoutingApp
import {Component} from "angular2/core"
import {RouteComponent} from './route.component'
import { RouteConfig,ROUTER_DIRECTIVES,ROUTER_PROVIDERS } from 'angular2/router';
@Component({
selector : 'app',template : `
go to this <a href="javascript:void()"data="/link">link</a>
<br />
<router-outlet></router-outlet>
`,directives: [ROUTER_DIRECTIVES],providers: [ROUTER_PROVIDERS]
})
@RouteConfig([
{path: '/link',name: 'Link',component: RouteComponent}
])
export class RoutingApp{
}
和RouteComponent
import {Component} from 'angular2/core'
@Component({
template: `
hello from RouteComponent
`
})
export class RouteComponent{}
我做错了什么？ Angular版本是2.0.0-beta.7.
谢谢您的任何见解.
解决方法
<a [routerLink]="['Link']">link</a>
由于您已将ROUTER_DIRECTIVES指定到组件的directives属性中,因此该指令可直接使用
angular2 – Angular 2.0路由器不工作重新加载浏览器
你能帮我找出为什么这个错误发生了。
The error you are seeing is because you are requesting 07000 which doesn’t exist. According to 07001.
使用html5路由时，您需要将应用程序中的所有路由(当前为404)映射到服务器端的index.html。这里有一些选项：
>使用live-server：https://www.npmjs.com/package/live-server
$ live-server –entry-file = index.html
>使用Nginx：http://nginx.org/en/docs/beginners_guide.html
error_page 404 = 200 /index.html
Angular2路由器(@角/路由器),如何设置默认路由？
这是我的主要应用程序组件，它定义了我的路线：
import { Component } from '@angular/core';
import { DashboardComponent } from './dashboard/dashboard.component';
import { ConfigManagerComponent } from './configManager/configManager.component';
import { ApplicationMgmtComponent } from './applicationMgmt/applicationMgmt.component';
import { MergeComponent } from './merge/merge.component';
import { ROUTER_DIRECTIVES,Routes } from '@angular/router';
@Component({
selector: 'app-container',templateUrl: 'app/app.component.html',directives: [ROUTER_DIRECTIVES]
})
@Routes([
{ path: '/Dashboard',component: DashboardComponent },{ path: '/ConfigManager',component: ConfigManagerComponent },{ path: '/Merge',component: MergeComponent },{ path: '/ApplicationManagement',component: ApplicationMgmtComponent }
])
export class AppComponent { }
当我点击这样的锚标签时，路线定义似乎工作正常：
<li><a [routerLink]="['./Dashboard']">Dashboard</a>/li>
它转换到相关的路由。我唯一的问题是，当我的应用加载它没有路由活动。当我的应用程序启动时，我如何定义一个有效的默认路由？
谢谢！
RouterConfig = [
{ path: '',redirectTo: '/heroes',pathMatch: 'full' },{ path: 'heroes',component: HeroComponent,children: [
{ path: '',redirectTo: '/detail',{ path: 'detail',component: HeroDetailComponent }
]
}
];
还有全部路线
{ path: '**',
它重定向“无效”网址。
V3-alpha(vladivostok)
使用路径/和redirectTo
RouterConfig = [
{ path: '/',redirectTo: 'heroes',terminal: true },children: [
{ path: '/',redirectTo: 'detail',component: HeroDetailComponent }
]
}
];
RC.1 @ angular / router
RC路由器不支持使用AsDefault。作为解决方法，您可以明确浏览。
在根组件中
export class AppComponent {
constructor(router:Router) {
router.navigate(['/Merge']);
}
}
用于其他组件
export class OtherComponent {
constructor(private router:Router) {}
routerOnActivate(curr: RouteSegment,prev?: RouteSegment,currTree?: RouteTree,prevTree?: RouteTree) : void {
this.router.navigate(['SomeRoute'],curr);
}
}
今天关于Angular 空路由器链接和angular路由配置的分享就到这里，希望大家有所收获，若想了解更多关于Angular 2 – 通过路由器链接将对象从一个组件发送到另一个组件、Angular 2路由器在路由时刷新页面、angular2 – Angular 2.0路由器不工作重新加载浏览器、Angular2路由器(@角/路由器),如何设置默认路由？等相关知识，可以在本站进行查询。
本文标签：
