为什么我的应用程序状态不以角度Ngrx呈现给应用程序

如何在加载应用程序时呈现状态?当我运行此应用程序时,状态为空,直到我单击带有单击功能的按钮。我尝试执行this.store.select,但我从未获得所请求的状态。 Todo_List是ngrx存储内的一个对象,我想呈现其list属性,该属性是一个数组

App.Component.ts

import { Component,OnInit } from '@angular/core';
import { Store } from '@ngrx/store';
import { AppState } from './AppState.model';
import { Add_Todo, Load_Todos } from './ngrx.actions';
import { Todo } from './ngrx.model';
import { HttpClient } from '@angular/common/http';
import { Observable } from 'rxjs';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})
export class AppComponent implements OnInit {
  constructor(private store: Store<AppState>,private http:HttpClient ){
  }
  todo_list$: Observable<Array<Todo>>
  loading$: Observable<Boolean>;
  ngOnInit(): void{
    console.log(this.store)
    this.store.dispatch(new Load_Todos());
    console.log(this.store)
    this.todo_list$ = this.store.source._value.Todo_List.list
    this.loading$ = this.store.source._value.Todo_List.loading
  }
  title = 'angular-todo-list';

  click(){

  //   console.log(this.store)
  //   this.store.dispatch(new Add_Todo({
  //     message: 'heyyyyy',
  //     time: '3pm',
  //     date:'05/16/20',
  //     user_id: 1,
  // }));

  this.todo_list$ = this.store.source._value.Todo_List.list
}
}

App.Component.ts

<button (click)="click()"id="enter"><i class="fas fa-pencil-alt"></i></button>
        <div class="row">
            <div class="listItems col-12">
                <ul class="col-12 offset-0 col-sm-8 offset-sm-2">
            <li *ngFor="let x of todo_list$">{{x.message}}</li>
                </ul>
            </div>
        </div>
    </div>
评论