Question

由于缺少文档（后卫，解析器，几乎没有文档记录的路由），我在Akita状态管理以及到目前为止一直在路由中使用的Angular解析器（当不使用状态mgmt的情况下）苦苦挣扎。

我正在看下面的Gist，其中作者确实在组件内部进行了订阅，我正在尝试将其移至解析器。

我尝试了多种变体，包括在解析器中包含以下行并进行订阅，但没有任何效果：

this.productsService.get().subscribe();

    this.loading$ = this.productsQuery.selectLoading();

    this.products$ = this.search.valueChanges.pipe(
      startWith(''),
      switchMap(value => this.productsQuery.selectAll({
         filterBy: entity => entity.title.toLowerCase().includes(value)
      }))
    );

Answer 1

您可以在解析器中获取数据并更新商店。

@Injectable()
class ProductsResolver {
  constructor(private productsService) {}

  resolve(
    route: ActivatedRouteSnapshot,
    state: RouterStateSnapshot
  ): Observable<any> {
    return this.productsService.getProducts().pipe(
      tap(products => {
        this.productsService.set(products);
      })
    )
  }
}


class ProductsService {
  constructor(private store: ProductsStore) {

  }

  set(products) {
    this.store.set(products);
  }
}

在您的路线上：

const routes: Routes = [
  {
    path: 'path',
    component: ProductsComponent,
    // The value that returns from the resolver resolve() method
    // will be assign to the products property on ActivatedRoute
    resolve: { products: ProductsResolver }
  }
];

然后在您的组件中：

class Component {
  constructor(private route: ActivatedRoute) {}

  ngOnInit() {
    this.products = this.route.snapshot.data['products'];
  }
}

带有秋田状态管理的角度解析器

1 个答案: