gpt4 book ai didi

javascript - ngOnInit() 被调用两次

转载 作者:行者123 更新时间:2023-11-29 23:15:01 26 4
gpt4 key购买 nike

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

更新

当运行 Debug模式时,我发现 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' });
}
}

问题是什么?

最佳答案

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

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

关于javascript - ngOnInit() 被调用两次,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53075088/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com