Angular CanDeactivate守卫是用来阻止用户在离开页面之前执行某些操作的。而Sweet Alert JS是一个弹窗插件，用来显示美观的弹窗。

如果你在使用Angular CanDeactivate守卫时遇到了Sweet Alert JS不起作用的问题，可能是因为Sweet Alert JS的代码执行时机不正确。

以下是一个解决方法的示例：

1. 首先，确保你已经正确引入了Sweet Alert JS的依赖，可以通过npm包管理器或手动引入。

2. 在你的组件中，创建一个CanDeactivate守卫，并在该守卫中使用Sweet Alert JS来显示一个确认弹窗。

import { Injectable } from '@angular/core';
import { CanDeactivate } from '@angular/router';
import { Observable } from 'rxjs';
import { SwalHelper } from 'path/to/sweet-alert-js-wrapper'; // 导入Sweet Alert JS的包装器

@Injectable()
export class ConfirmCanDeactivate implements CanDeactivate {
  canDeactivate(
    component: any,
    currentRoute: ActivatedRouteSnapshot,
    currentState: RouterStateSnapshot,
    nextState: RouterStateSnapshot
  ): Observable | boolean {
    // 使用Sweet Alert JS显示确认弹窗
    SwalHelper.confirm({
      title: '确认离开页面？',
      text: '您的修改可能不会保存。',
      confirmButtonText: '确认',
      cancelButtonText: '取消',
      showCancelButton: true,
    }).then((result) => {
      if (result.isConfirmed) {
        // 用户确认离开页面
        return true;
      } else {
        // 用户取消离开页面
        return false;
      }
    });
  }
}

3. 在你的路由配置中，将CanDeactivate守卫应用到需要使用的组件上。

import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { YourComponent } from './your-component.component';
import { ConfirmCanDeactivate } from './confirm-can-deactivate.guard'; // 导入CanDeactivate守卫

const routes: Routes = [
  {
    path: 'your-component',
    component: YourComponent,
    canDeactivate: [ConfirmCanDeactivate], // 应用CanDeactivate守卫
  },
];

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule],
})
export class AppRoutingModule {}

现在，当用户尝试离开该组件时，会触发CanDeactivate守卫，并显示Sweet Alert JS的确认弹窗。用户可以选择确认离开页面或取消离开页面。根据用户的选择，CanDeactivate守卫会返回一个Observable或boolean值，以决定是否允许离开页面。

请注意，Sweet Alert JS的使用方式可能因版本而异，请根据你的Sweet Alert JS版本来调整代码。此外，如果你的问题还没有解决，请提供更多的代码示例和错误信息，以便我们能够更好地帮助你。