ngOnInit（）被调用两次

Question

我想通过Angular 6创建一个更新页面，以首先从Web服务加载数据并在html form中建立数据。我创建了一个resovler来处理异步数据加载，但是即使我可以看到Web服务返回200并从浏览器以正确的格式提供所有数据，该组件中的观察者也始终返回null，这是代码片段< / p>

更新

在运行调试模式时，我发现ngOnInit()被调用了两次，而resolver仅被调用了一次。

第一次ngOnInit()确实提供了购物车对象，但下一次购物车对象为空。

我没有从Angular控制台看到任何错误，也没有在FireFox控制台中看到任何错误

解析器

@Injectable({
  providedIn: 'root'
})
export class CartResolver implements Resolve<ServiceCart> {
  constructor(private service: CartService) {}

  resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
    const id = route.params['id'] ? route.params['id'] : null;
    if (id) {
      const existingCart = this.service.find(id).pipe(map((cart: HttpResponse<ServiceCart>) => cart.body));
      return existingCart;
    }

    return of(new ServiceCart());
  }
}

路由器

const routes: Routes = [
  {
    path: '', component: CartComponent,
    children: [
      {path: '', redirectTo: 'list', pathMatch: 'full'},
      {path: 'list', component: CartListComponent},
      {path: 'create', component: CartEditComponent, resolve: {cart: CartResolver}},
      {path: 'update/:id', component: CartEditComponent, resolve: {cart: CartResolver}}
    ]
  }];


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

组件

@Component({
  selector: 'app-cart-edit',
  templateUrl: './cart-edit.component.html',
  styleUrls: ['./cart-edit.component.css']
})
export class CartEditComponent  implements OnInit {
    cart: ServiceCart;
    .....
    ngOnInit() {
      this.isSaving = false;
      this.activatedRoute.data.subscribe(({ cart }) => {
        this.cart = cart;          // <--- always null
      });
    }

CartService（用于处理RESTful服务）

@Injectable({
  providedIn: 'root'
})
export class CartService {
    find(id: number): Observable<EntityResponseType> {
    return this.http.get<ServiceCart>(`${this.environment.config.servicesBaseUrl + '/api/carts'}/${id}`,
      { observe: 'response' });
    }
}

出什么问题了？

Answer 1

我认为这不是ngOnInit()问题。实际上在调试模式下服务命中了两次。有关更多详细信息，请参见此答案。

https://stackoverflow.com/a/36353822/7541317