Блог

У меня есть угловой компонент, который для этой цели выглядит следующим образом:

 <div click="onClick()">
<a [routerLink]="url">
</a>
</div>
 

<a> занимает 100% div, поэтому, когда я нажимаю div или привязку, я хочу вызвать событие onClick () плюс navigate.

Проблема в том, что иногда сначала происходит навигация, а событие щелчка теряется. Поскольку я хочу, чтобы при наведении курсора мыши отображалась ссылка url, по которой я тоже перемещаюсь, я думаю, что другого решения, кроме использования routerLink, нет?

В основном, чтобы показать это:

А если нет, то как я могу убедиться, что, несмотря на навигацию, я всегда запускаю onClick() ?

Вы можете внедрить службу маршрутизатора в свой компонентный контроллер, а затем установить навигацию внутри своей onClick функции.

constructor(private readonly router: Router) { }

и затем:

 onClick() {
     this.router.navigate(['url']);
    ...
}
 

что случилось!

пара слов, прежде чем мы перейдем к фактическому ответу, просто чтобы убедиться, что вы знаете, как работать с модулем маршрутизатора

 const routes: Routes = [
  { path: "", pathMatch: "full", redirectTo: "home" },
  { path: "home", component: HomepageComponent },
  { path: "register", component: RegisterComponent },
  { path: "buyingmainpage", component: BuyingmainpageComponent , canActivate : [AuthGuard] },
  { path: "checkoutmainpage", component: CheckoutmainpageComponent , canActivate : [AuthGuard] },
  { path: "checkoutsuccess", component: CheckoutsuccessComponent , canActivate : [AuthGuard] },
  { path: "**", component: Eror404Component },
];
 
@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})


 

скажите, знакома ли вам эта концепция?

первый шаг — включить путь к нужному URL-адресу в маршруты, как в приведенном выше коде

ответ

способ заставить это работать в angular — использовать Router

сначала вы импортируете его в начале кода

 import { Router } from '@angular/router';
 

затем в функции конструктора вы объявляете ее следующим образом

   constructor(
    private router: Router,
    ) {}
 

затем вы можете запустить нужную функцию onClick и использовать функцию

router.navigateByUrl(«/abc»)

с помощью строки внутри него для перехода к нужному URL-адресу 🙂

 onClick(){
this.router.navigateByUrl("/checkoutmainpage")
}
 

если вам нужен видеозвонок, я могу вам помочь ,

не стесняйтесь обращаться ко мне по whats app или электронной почте, какое приложение будет быстрее

972505884960 / dolev146@gmail.com