标签: angular7

现在点击汉堡菜单我得到下拉列表而不是我需要它在鼠标悬停在汉堡菜单上这里是堆栈闪电战链接。

我有这个路由配置并且它完美地工作，只有一件事让我烦恼：即使导航应用程序有效，当我转到地址栏并按回车键时，它会将我重定向到 /dashboard，即使我不更改 url 和点击进入。

这是我的路由配置：

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

import { FullComponent } from './layouts/full/full.component';

export const Approutes: Routes = [
  {
    path: '',
    component: FullComponent,
    children: [
      {
        path: 'usuarios',
        loadChildren: './pages/usuarios/usuarios.module#UsuariosModule'
      },
      {
        path: 'autores',
        loadChildren: './pages/autores/autores.module#AutoresModule'
      },
      {
        path: 'conteudos',
        loadChildren: './pages/conteudos/conteudos.module#ConteudosModule'
      },
      {
        path: 'projetos',
        loadChildren: './pages/projetos/projetos.module#ProjetosModule'
      },
      {
        path: 'dashboard',
        loadChildren: './pages/dashboard/dashboard.module#DashboardModule'
      },
    ]
  },
  {
    path: 'login',
    loadChildren: './pages/login/login.module#LoginModule'
  },
  {
    path: '',
    redirectTo: '/dashboard',
    pathMatch: 'full'
  }
];

我注意到的另一件事是，当我按下 Enter 键并查看我的网络时，我可以看到该页面的解析器被调用，但随后我被重定向到 …

我必须使用 CURD 操作实现一个角度应用程序。API 已经托管在 AWS 中，它与 Postman 一起工作得很好。

但我的角度应用程序得到

CORS 政策已阻止在“ https://acp56df5alc.execute-api.us-east-1.amazonaws.com/ams/getmember ”处访问 XMLHttpRequest来自源“ http://localhost:4200 ”：响应预检请求未通过访问控制检查：请求的资源上不存在“Access-Control-Allow-Origin”标头。

我的代码如下，

http_GET(actionUrl: string): Observable<any> {
        const httpOptions = {
            headers: new HttpHeaders({
                'Content-Type': 'application/json',
                'Access-Control-Allow-Origin': '*',
                'Access-Control-Allow-Credentials': 'true',
                'Access-Control-Allow-Headers': 'Content-Type',
                'Access-Control-Allow-Methods': 'GET,PUT,POST,DELETE',
                'key': 'x-api-key',
                'value': 'NNctr6Tjrw9794gFXf3fi6zWBZ78j6Gv3UCb3y0x',

            })
        };
        return this.http.get<any>(this.baseUrl + actionUrl, httpOptions).pipe(
            (response => {
                return response;
            }));
    }

我已经努力解决这个问题。但需要一些帮助

我有一个 Angular 7 应用程序，使用 CDK Drag-n-Drop 在一个很长的列表中拖放行。

我应该怎么做才能让长列表在拖出当前视图时自动滚动？

我可以参考任何示例代码吗？

我阅读了Angular 测试，但不确定是否有任何关于在模态中测试元素以及如何检查自定义操作的参考。我的目的是编写必要的测试表明我将确保我的函数和模态按预期工作。

由于模态被隐藏，检查模态元素是否出现的测试失败。所以我想这里缺少一些东西。

这是我的photos.components.ts文件：

import {Component, OnInit, ViewEncapsulation} from '@angular/core';
import { NgbModal } from '@ng-bootstrap/ng-bootstrap';

@Component({
  selector: 'app-photos',
  templateUrl: './photos.component.html',
  styleUrls: ['./photos.component.scss'],
  encapsulation: ViewEncapsulation.None
})
export class PhotosComponent implements OnInit {

  constructor(private modalService: NgbModal) { }

  openDarkModal(content) {
    this.modalService.open(content, { windowClass: 'dark-modal', size: 'lg', centered: true });
  }

  ngOnInit() {
  }

}

这是我的photos.component.html文件：

<div>
  <div class="col-lg-4 col-sm-6 mb-3">
    <a><img (click)="openDarkModal(content)" id="photo-one" class="img-fluid z-depth-4 relative waves-light" src="#" alt="Image" data-toggle="content" data-target="#content"></a>
  </div>
</div>

<!-- Dark …

我是 angular7/typescript 的新手，我想将布尔值作为 Httpparam 传递，这可能吗？

let body = new HttpParams();
body = body.set('name', string);
body = body.set('value', boolean);

问题是我如何传递布尔值

我在我的第一个 Angular 应用程序中构建了一个错误拦截器，这对我来说是全新的。当出现401响应代码时，拦截器会尝试刷新 Firebase 授权令牌。因此，我编写了以下代码：

@Injectable()
export class ErrorInterceptor implements HttpInterceptor {
constructor(private authService: AuthService, private alertService: AlertService) { }

intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    return next.handle(request).pipe(
        catchError(err => {
            if (err.status === 401) {
                let user = localStorage.getItem('currentUser');
                if (!user) {
                    this.logout(false);
                    return throwError(err.error);
                }
                let currentUser = JSON.parse(user);
                if (!currentUser || !currentUser.stsTokenManager || !currentUser.stsTokenManager.accessToken) {
                    this.logout(false);
                    return throwError(err.error);
                }
                const reference = this;
                this.authService.getToken(currentUser, true).then(t => {
                    // How do I await and return this …

在文件 models/User.model.ts（见下文）中，我尝试设置一个方法 isEqual，如下面的代码所示。有人可以更正我的代码吗？

文件模型/User.model.ts：

export class User {
    constructor(
    public firstName: string,
    public lastName: string,
    ) {}

    isEqual (other : User): boolean {
    return other === this;
    }
}

文件服务/user.service.ts ：

import { User } from '../models/User.model';
import { Subject } from 'rxjs/Subject';

export class UserService {

    private users: User[] = [
    {
        firstName: 'William',
        lastName: 'Jones'
    },
    {
        firstName: 'John',
        lastName: 'Doe'
    }
    ];

...

services/user.service.ts(7,2) 中的错误：错误 TS2741：类型“{ firstName: string;”中缺少属性“isEqual”；lastName: string;}' 但在类型 'User' 中是必需的。

在子组件中发生事件后，我需要通过调用父组件中的函数来更新父组件中的一些数据。这里我的子组件位于父组件的路由器出口中

parentComponent.html:-

<div class="row">
     Parent component
</div>
<router-outlet></router-outlet>

父组件.ts：-

fetchRequestsStatus(role, user) {
if (this.userRole) {
  this.dashboardService.getStatusCount(role, user).subscribe(
    res => {
      console.log(res)
    },
    err => {
      console.log(err)
    })
}

}

现在在子级中单击按钮，我需要fetchRequestsStatus(role, user)通过从子级传递参数来调用函数。我已经看到@input @ output 装饰器用于共享数据，但这里我的子组件位于路由器内部。

我该如何处理？

使用 Angular 7 和 Typescript：我有一个使用大量服务和子类（大约 40 个子类）的基类，我不想在所有子类构造函数中添加这些服务并将它们传递给super()但我仍然需要在所有子类中使用这些服务。

export class parentTool {

    constructor(type: string, public service1: Service1, public service2: Service2,public service3: Service3, public service4: Service4){}
}

export class ChildTool1 extends parentTool {

    constructor(public service1: Service1, public service2: Service2,public service3: Service3, public service4: Service4) {

        super("tool1", service1, service2, service3, service4);
    }
}

export class ChildTool2 extends parentTool {

    constructor(public service1: Service1, public service2: Service2,public service3: Service3, public service4: Service4) {

        super("tool2", service1, service2, service3, service4);
    }
}