Я пытаюсь реализовать перевождь с неизменными JS в моем angualar2 приложенииНевозможно создать Redux магазин в angular2
вот моя модель:
export class TodoModel {
id: number;
text: string;
isCompleted: boolean;
};
export interface ITodoAction {
type: string;
todo: TodoModel;
}
здесь действие
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
};
}
здесь является моим редуктором
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);
}
};
вот мой магазин
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);
}
}
вот мой компонент, на котором я должен использовать магазин
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() {
}
}
Но когда я запускаю мое приложение, я получил ошибку
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.)
Я не уверен, что я пропустил здесь, пожалуйста, помогите, чтобы он работал ..