kann nicht Redux store in angular2

Question

Ich versuche zu implementieren redux mit unveränderlichen js in meiner angualar2 Anwendung

hier ist mein Modell erstellen:

export class TodoModel { 
    id: number; 
    text: string; 
    isCompleted: boolean; 
}; 
export interface ITodoAction { 
    type: string; 
    todo: TodoModel; 
} 

hier ist Aktion

import { TodoModel, ITodoAction } from '../model/todo.model'; 
export function addTodo(todo: TodoModel): ITodoAction { 
    return { 
     type: 'ADD_TODO', 
     todo 
    }; 
} 

export function removeTodo(todo: TodoModel): ITodoAction { 
    return { 
     type: 'REMOVE_TODO', 
     todo 
    }; 
} 


export function completeTodo(todo: TodoModel): ITodoAction { 
    return { 
     type: 'TOGGLE_TODO', 
     todo 
    }; 
} 

hier ist mein Reduzierer

import { List } from 'immutable'; 
import { TodoModel, ITodoAction } from '../model/todo.model'; 

export const todoReducer = (state: List<TodoModel>, action: ITodoAction) => { 
    switch (action.type) { 
     case 'ADD_TODO': 
      return state.push(action.todo); 
     case 'REMOVE_TODO': 
      return state.delete(findIndexById()); 
     case 'UPDATE_TODO': 
      return state.update(findIndexById(), (todo) => { 
       return { 
        id: todo.id, 
        text: todo.text, 
        isCompleted: todo.isCompleted 
       }; 
      }); 
     case 'TOGGLE_TODO': 
      return state.update(findIndexById(), (todo) => { 
       return { 
        id: todo.id, 
        text: todo.text, 
        isCompleted: !todo.isCompleted 
       }; 
      }); 
     default: 
      return state; 
    } 
    function findIndexById() { 
     return state.findIndex((todo) => todo.id === action.todo.id); 
    } 
}; 

hier ist mein Geschäft

import { List } from 'immutable'; 
import { createStore } from 'redux'; 
import { ITodoAction, TodoModel } from '../model/todo.model'; 
import { todoReducer } from '../reducer/todo.reducer'; 

export class TodoStore { 
    store = createStore(todoReducer); 

    get todos(): Array<TodoModel> { 
     return this.store.getState().toJS(); 
    } 

    dispatch(action: ITodoAction) { 
     this.store.dispatch(action); 
    } 
} 

hier ist meine Komponente, auf dem ich Gebrauch speichern

import { Component, OnInit } from '@angular/core'; 
import { TodoStore } from '../../common/store/todo.store'; 
@Component({ 
    selector: 'app-todo', 
    templateUrl: './todo.component.html', 
    styleUrls: ['./todo.component.css'] 
}) 
export class TodoComponent implements OnInit { 
    // todo: TodoModel; 
    constructor(private store: TodoStore) { 
    // this.todo = new TodoModel(); 
    } 

    ngOnInit() { 
    } 
} 

Aber wenn ich meine Anwendung ausführen ich habe den Fehler

Module build failed: Error: F:/Tutorial/angular2/ngTutorial/src/app/common/store/todo.store.ts (7,5): Public property 'store 
' of exported class has or is using name 'Store' from external module "F:/Tutorial/angular2/ngTutorial/node_modules/redux/in 
dex" but cannot be named.) 

haben

Ich bin mir nicht sicher was ich hier vermisse, bitte helft es zu funktionieren ..

Answer 1

Das Problem wird von dieser Linie in Ihrem TodoStore verursacht:

store = createStore(todoReducer); 

Die Art der store Eigenschaft wird gefolgert, als Store und Eigentum ist öffentlich. Store wird jedoch nicht von redux importiert, und das ist der Grund für den TypeScript-Fehler.

Um das Problem zu lösen, können Sie entweder die Eigenschaft privat machen - muss es wirklich öffentlich sein? - oder könnte importieren Store:

import { createStore, Store } from 'redux'; 

Weitere Informationen finden Sie in diesem GitHub issue comment.