Question

我是Angular2初学者，创建了一个测试笔记应用程序。该应用很简单：我有一个NotesContianerComponent连接到NoteService，其中getNotes()和addNote()方法。

在NotesContainerComponent中，我将从服务返回的数据存储在成员myNotes和ngOnInit事件中，刷新数组。到目前为止，我没有在该代码中的任何地方触摸该数组。

现在，当我使用表单添加新笔记并从addNote()调用服务的NotesContainerComponent方法时，笔记会添加到后端模拟笔记数组中，但同时UI（即NotesContainerComponent）会自动更新新笔记！我没有做任何事情来手动刷新它。

为了进行调查，我在服务的console.log()方法中添加了getNotes，但它只是第一次调用，可能是ngOnInit挂钩。

我无法弄清楚的是，Angular2如何在不查询服务的情况下自动了解新笔记？以及如何阻止这个？任何线索都将受到赞赏。

NotesContainerComponent代码供参考：

export class NotesContainerComponent implements OnInit {
    constructor(
        private noteService: NoteService
    ) { }

    addNote(newNote):void {
        this.noteService.add(newNote);
    }

    myNotes: Notes[];

    ngOnInit() {
        this.noteService.getNotes()
            .then(notes => this.myNotes = notes);
    }
}

Answer 1

如果您要将模拟数据存储在Object或Array中，this.myNotes的引用是Object的引用。当您的模拟数据内容发生更改时，所有引用也将更改。这是因为对象在javascript中是可变的。

Angular - 无法看到Angular2如何自动更新服务中的数据

1 个答案: