小编Ofi*_*son的帖子

我有课程详细信息组件，其中包含来自后端应用程序的数据（名为课程），我想将该数据传递给与该组件无关的另一个组件（课程播放）。我想在这两个组件中显示从后端获得的相同数据。这是相关文件：

应用程序路由模块：

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';

import { CourseListComponent } from './courses/course-list/course-list.component';
import { CourseDetailComponent } from './courses/course-detail/course-detail.component';
import { CoursePlayComponent } from './courses/course-play/course-play.component';
import { PageNotFoundComponent } from './page-not-found/page-not-found.component';

const appRoutes: Routes = [
  { path: '', redirectTo: '/courses', pathMatch: 'full' },
  { path: 'courses', component: CourseListComponent,  pathMatch: 'full' },
  { path: 'courses/:id', component: CourseDetailComponent, pathMatch: 'full'},
  { path: 'courses/:id/:id', component: CoursePlayComponent, pathMatch: 'full' },
  { path: '**', component: PageNotFoundComponent, …

我在两件事上遇到了麻烦：

1. 隐藏 mat-radio-group 的圆圈
2. 如果选中，请将 p 标签背景更改为蓝色

我尝试使用 ::ng-deep 覆盖 css 属性并将颜色更改为白色，尝试配置 invisibility:hidden 但没有成功。另外，我尝试使用 ngStyle 配置 p 标签的背景颜色如果选中则为蓝色，但它不起作用。

这是 HTML：

<div class="container-fluid">
  <header class="lesson-heading" *ngIf="currentQuestion">
    <span class="title"></span>
    <h2>Question {{currentIndex + 1}}/{{quiz.questions.length}}</h2>
  </header><!-- end lesson-heading -->
  <div class="question-block">
    <form #quizForm="ngForm" (ngSubmit)="onSubmit()">
      <h4>{{currentQuestion.question}}</h4>
      <div class="form-group">
        <mat-radio-group [(ngModel)]="userAnswers[currentIndex]" name="answer" class="form-control">
          <ul class="items answers-list">
            <li><mat-radio-button [value]=1><p>1. {{currentQuestion.answer1}}</p></mat-radio-button></li>
            <li><mat-radio-button [value]=2><p>2. {{currentQuestion.answer2}}</p></mat-radio-button></li>
            <li><mat-radio-button [value]=3><p>3. {{currentQuestion.answer3}}</p></mat-radio-button></li>
            <li><mat-radio-button [value]=4><p>4. {{currentQuestion.answer4}}</p></mat-radio-button></li>
          </ul>
        </mat-radio-group>
      </div>
    </form>
  </div>
</div>

和 SASS 文件：

/*click effect color change*/
::ng-deep .mat-radio-button.mat-accent .mat-radio-ripple .mat-ripple-element
  background-color: …

我有一个完整的角度应用程序，它使用急切加载。我想将其转换为延迟加载，但是因为我对所有路线都有保护，并且所有路线都是受保护的一条主路线的子路线，所以我不知道是否可以做到这一点并仍然使其发挥作用就像急切加载一样。

这是我在 app-routing.module 中的路由数组：

// Routing array - set routes to each html page
const appRoutes: Routes = [
  { path: 'login/:id', canActivate: [AuthGuard], children: [] },
  { path: '', canActivateChild: [AuthGuard], children: [
    { path: '', redirectTo: '/courses', pathMatch: 'full' },
    { path: 'courses', component: CourseListComponent,  pathMatch: 'full'},
    { path: 'courses/:courseId', component: CourseDetailComponent, pathMatch: 'full' },
    { path: 'courses/:courseId/unit/:unitId', component: CoursePlayComponent,
      children: [
        { path: '', component: CourseListComponent },
        { path: 'lesson/:lessonId', component: CourseLessonComponent, data:{ type: 'lesson'} },
        { …

编辑：它仍然不起作用并且不会抛出任何错误。我编辑了代码并从 parent.component.ts 添加了部分代码

我有一个侧导航栏的父组件和嵌套在父组件主体中并包含 iframe 的子组件。我希望当 iframe 上有点击事件时，我会返回发生事件的父级，这样我就可以在父级的侧边栏中用“V”标记此视频为已观看。

父组件.ts

// ..... 

export class CoursePlayComponent implements OnInit {
    course: ICourse;
    courseId: number;

    // current user
    public currentUser: IUser;

    // variables for current lesson
    public current: IVideo;
      
    constructor(private courseService: CourseService,
     private route: ActivatedRoute,
     private router: Router,
     private userService: UserService) {
         this.currentUser = JSON.parse(localStorage.getItem('currentUser'));
      }
       
    ngOnInit() {
     // save this course id from course-detail and get http request from the service
     this.courseId = JSON.parse(localStorage.getItem("courseId"));
     this.getCourse(this.courseId);
    }
    
    // get course by id from service …

我试图通过只允许某些 ID 访问来确保前端的安全。我希望如果有人尝试输入除 之外的任何路线/login/:id，如果他尚未登录，他会收到页面未找到的信息，但它不起作用。

这些是我的路由表和防护：

编辑： 我解决了问题并更新了代码：

应用程序路由.module.ts

// Routing array - set routes to each html page
const appRoutes: Routes = [{
    path: 'login/:id',
    canActivate: [AuthGuard],
    children: []
  },
  {
    path: '',
    canActivate: [AuthGuard],
    canActivateChild: [AuthGuard],
    children: [{
        path: '',
        redirectTo: '/courses',
        pathMatch: 'full'
      },
      {
        path: 'courses',
        component: CourseListComponent,
        pathMatch: 'full'
      },
      {
        path: 'courses/:courseId',
        component: CourseDetailComponent,
        pathMatch: 'full'
      },
      {
        path: 'courses/:courseId/unit/:unitId',
        component: CoursePlayComponent,
        children: [{
            path: '',
            component: CourseListComponent
          },
          {
            path: 'lesson/:lessonId',
            component: …

编辑：我用 PierreDuc 给我的答案更新了代码。他的解决方案对我有用。我编辑代码以便每个人都可以看到工作代码

我正在使用 canActivate 和 canActivateChild 来了解是否有人拥有我的网络令牌，我想阻止任何没有令牌的人。我将 localStorage 用于用户数据和令牌。

当我尝试使用用户 id:1 登录时，守卫导航到未找到的页面，但在我刷新页面后，我可以访问该页面。当我使用调试器时，我看到在刷新之前 localStorage 是空的，但在刷新后有值。

为什么会发生这种情况？我该如何解决？这是相关代码：

app-routing.module.ts

const appRoutes: Routes = [
  { path: 'login/:id', canActivate: [AuthGuard], children: [] },
  { path: '', canActivateChild: [AuthGuard], children: [
    { path: '', redirectTo: '/courses', pathMatch: 'full' },
    { path: 'courses', component: CourseListComponent,  pathMatch: 'full'},
    { path: 'courses/:courseId', component: CourseDetailComponent, pathMatch: 'full' },
    { path: 'courses/:courseId/unit/:unitId', component: CoursePlayComponent,
      children: [
        { path: '', component: CourseListComponent },
        { path: 'lesson/:lessonId', component: CourseLessonComponent, data:{ type: …

我想将 Postgres 中的这段代码转换为更短的代码，以实现相同的效果。我读过有关 upsert 的内容，但我不明白在我的代码上实现它的好方法。我写的很好，但我想找到一种更优雅的方式来编写它。希望这里有人可以帮助我！这是查询：

CREATE OR REPLACE FUNCTION insert_table(
    in_guid    character varying,
    in_x_value character varying,
    in_y_value character varying
)
RETURNS TABLE(response boolean) LANGUAGE 'plpgsql'

DECLARE _id integer;

BEGIN
    -- guid exists and it's been 10 minutes from created_date:
    IF ((SELECT COUNT (*) FROM public.tbl_client_location WHERE guid = in_guid AND created_date < NOW() - INTERVAL '10 MINUTE') > 0) THEN
        RETURN QUERY (SELECT FALSE);
    
    -- guid exists but 10 minutes hasen't passed yet:
    ELSEIF ((SELECT COUNT (*) FROM public.tbl_client_location WHERE …