如何在AngularJS 4中获取当前URL?我在网上搜索了很多,但无法找到解决方案.
app.module.ts
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { RouterModule, Router } from '@angular/Router';
import { AppComponent } from './app.component';
import { TestComponent } from './test/test.component';
import { OtherComponent } from './other/other.component';
import { UnitComponent } from './unit/unit.component';
@NgModule ({
declarations: [
AppComponent,
TestComponent,
OtherComponent,
UnitComponent
],
imports: [
BrowserModule,
RouterModule.forRoot([
{
path: 'test',
component: TestComponent
},
{
path: 'unit',
component: UnitComponent
},
{
path: 'other',
component: OtherComponent
}
]),
],
providers: …Run Code Online (Sandbox Code Playgroud) 如何在Angular 2路由器中监听状态变化?
在Angular 1.x中我使用了这个事件:
$rootScope.$on('$stateChangeStart',
function(event,toState,toParams,fromState,fromParams, options){ ... })
Run Code Online (Sandbox Code Playgroud)
所以,如果我在Angular 2中使用这个eventlistener:
window.addEventListener("hashchange", () => {return console.log('ok')}, false);
Run Code Online (Sandbox Code Playgroud)
它不是返回'ok',然后从JS更改状态,然后才运行浏览器history.back()函数.
使用router.subscribe()函数作为服务:
import {Injectable} from 'angular2/core';
import {Router} from 'angular2/router';
@Injectable()
export class SubscribeService {
constructor (private _router: Router) {
this._router.subscribe(val => {
console.info(val, '<-- subscribe func');
})
}
}
Run Code Online (Sandbox Code Playgroud)
在路由中初始化的组件中注入服务:
import {Component} from 'angular2/core';
import {Router} from 'angular2/router';
@Component({
selector: 'main',
templateUrl: '../templates/main.html',
providers: [SubscribeService]
})
export class MainComponent {
constructor (private subscribeService: SubscribeService) {}
}
Run Code Online (Sandbox Code Playgroud)
我将此服务注入其他组件,例如本例中.然后我改变状态,console.info()在服务中不起作用.
我做错了什么?
使用Router(this.router.url)时/MyRouterName?type=abc,/MyRouterName如果没有参数,我会得到字符串
我是否只能/MyRouterName从完整的URL 获取路径(对于所有情况)?
使用Angular2创建单页面应用程序,我将拦截未经身份验证的用户访问自定义中的非公共路由RouterOutlet并将其重定向到登录视图.成功登录后,我想将用户重定向到最初请求的视图,而不是默认视图.
我注意到Router有一个renavigate()导航到最后一条成功路线的功能,但最后一条成功的路线是,/auth/login而不是最初请求的网址.
基本上:我如何访问或确定以前请求的URL?
我真的不想求助于传递查询字符串参数,除非我真的需要.理想情况下,访问history集合作为Router组件的一部分会很好,类似于backbone.history!
我有一个带有几个嵌套子视图的Angular 2应用程序.但它会显示在同一页面上router-outlet.
const routes: Routes = [
{
path: 'queue/:date/:offset/:type',
component: BundleListComponent,
resolve: {
response: BundleListResolve
},
children: [
{
path: ':bundleId', component: PointListComponent,
resolve: {
response: PointListResolve
},
children: [
{
path: ':pointId', component: TaskListComponent,
resolve: {
response: TaskListResolve
},
children: [
{
path: ':taskId', component: TaskDetailComponent,
resolve: {
response: TaskDetailResolve
}
},
{ path: '', component: EmptyComponent }
]
},
{ path: '', component: EmptyComponent }
]
},
{ path: '', component: EmptyComponent }
]
}, …Run Code Online (Sandbox Code Playgroud) 因此,我需要以某种方式检查我是否在主页上并做某事,而在其他页面中则不这样做.还在所有页面上导入该组件.
如果我在主页上,如何检测该组件?
谢谢
我试图通过使用路由器获取当前的路由器路径,但是当我这样做console.log(this.router.url)时返回"/",虽然我在"/ login".但是当我安慰整个this.router对象时,有一个url值为"/ login" 的属性.
这是来自app.component.ts的代码
export class AppComponent implements OnInit{
constructor(private router: Router) {}
ngOnInit(){
console.log(this.router);
}
}
Run Code Online (Sandbox Code Playgroud)
app.module.routing.ts
import {NgModule} from '@angular/core';
import {PreloadAllModules, RouterModule, Routes} from '@angular/router';
import {NotFoundComponent} from './not-found/not-found.component';
import {AuthGuard} from './auth/auth-guard.service';
const appRoutes: Routes = [
{ path: '', loadChildren: './first/first.module#FirstModule'},
{ path: 'login', loadChildren: './login/login.module#LoginModule'},
{ path: '404', component: NotFoundComponent, canActivate: [AuthGuard] },
{ path: '**', redirectTo: '/404'}
];
@NgModule({
imports: [RouterModule.forRoot(appRoutes, {preloadingStrategy: PreloadAllModules})],
exports: [RouterModule]
}) …Run Code Online (Sandbox Code Playgroud) 我正在尝试在ionic 4的app.component中获取当前页面实例。
在ionic 3中,我可以这样做
this.nav.getActive()。instance
我正在处理 angular5/html 5 项目。我有一个侧面导航菜单组件,它显示在我的应用程序的所有页面上。问题是这个侧边导航菜单组件是动态的,如果在应用程序中添加更多页面,它会自动更新。
现在我想做的是仅在某些页面上隐藏此菜单。例如,我想在第 1-5 页保持可见,在第 6-8 页隐藏,在第 9 和 10 页再次可见。我应该怎么做?
这是我为侧导航菜单编辑的 html 代码:
<aside>
<div class="sidebar">
<nav>
<div class="sidebar__wrap">
<ol class="left-nav">
</ol>
</div>
</nav>
</div>
</aside>
Run Code Online (Sandbox Code Playgroud) 如何在不使用angular 7的情况下获取完整的当前URL window.location.href?
例如,假设我当前的网址是 http://localhost:8080/p/drinks?q=cold&price=200
如何获得完整的URL而不仅仅是完整的URL /p/drinks?q=cold&price=200?
我已经尝试过使用this.router.url此命令,但/p/drinks?q=cold&price=200不能提供完整的主机名。
我不想使用的window.location.href原因是它导致ng-toolkit / universal中的渲染出现问题
我尝试遵循此解决方案,这似乎与我存在相同的问题,并且也进行了更新
这是我的代码
windowProvider.js
import { InjectionToken, FactoryProvider } from '@angular/core';
export const WINDOW = new InjectionToken<Window>('window');
const windowProvider: FactoryProvider = {
provide: WINDOW,
useFactory: () => window
};
export const WINDOW_PROVIDERS = [
windowProvider
];
Run Code Online (Sandbox Code Playgroud)
在app.module.ts中
@NgModule({
.......
providers:[
.......
windowProvider
]
})
Run Code Online (Sandbox Code Playgroud)
在我的必填页面中:
import {WINDOW as WindowFactory} from '../../factory/windowProvider';
......
constructor(private router: Router, private helper: Helpers, …Run Code Online (Sandbox Code Playgroud) 我的路由是
{
path:'contacts/:id',
component: contactDetail
}
Run Code Online (Sandbox Code Playgroud)
在
canActivateChild( route: ActivatedRouteSnapshot,
state: RouterStateSnapshot) {
console.log(state.url);
}
Run Code Online (Sandbox Code Playgroud)
state.url返回/contacts/1我需要的是匹配的url/contact/:id是否有可能获得匹配的url?
angular angular-router-guards angular-router angular-routerlink
angular ×10
javascript ×3
typescript ×3
routes ×2
angular7 ×1
html ×1
ionic4 ×1
redirect ×1
routing ×1
url-routing ×1