ngrx - use @output or interact with store directly

What is better good practice ?! Because ngrx give us the sore, we can listen for state and we can dispatch action from any component.

So I write some simple todos list application:

Container: TodosListComponent

@Component({
  selector: 'todos-list',
  template: `
        <ul>
            <li *ngFor="let todo of list">
                <todo [todo]="todo"></todo>
            </li>
        </ul>
  `,
})
export class TodosListComponent implements OnInit {
  public list;
  constructor(private store: Store<any>) { }

  ngOnInit() {
    this.list = this.store.select('todos','list');  
  }

}

Child: Todo Compnent

@Component({
  selector: 'todo',
  template: `
    <span>{{ todo.content}}</span>
    <span (click)="delete(todo)"> X </span>
  `,
})
export class TodoComponent implements OnInit {

  @Input() todo: Todo;
  constructor(
      private store: Store<any>
  ) { }

  ngOnInit() {

  }

  delete(todo) {
      this.store.dispatch({type: 'DELETE_TODO', payload: todo});
  }
}

So in this way we listen for list(state) on TodosListComponent then we can change the list from any component, in this case we delete todo from todo component the list will update auto by the store.

But other way is use @Output (event emitter) and then dispatch the action from the container?

My question is which way is better and why?

I think the first is better because if we have more complex example like data-grid element that listen for Results(state), we can change the result(state) from other components without complex event emitter

I fill the use of @Output is not needed because store give us the ability to listen and dispatch action every where.

But what is better, and why? :)

I don't need code review because i ask about the data flow not about this app code(it's example).

Thank you!