javascript - HTTP 请求后未触发 NgOnChanges

Question

我有一个关于 ngonchanges 没有触发的问题。

我有这个组件：

@Component({
    selector: 'conversation-detail',
    templateUrl: './conversation-detail.component.html'
})
export class ConversationDetailComponent implements OnChanges{
    @Input()
    selectedConversation: Conversation;

    title = 'Conversation Detail';    
    convoMessages: Array<Message> = [];


    constructor(
            private _messageService: MessageService
    ){};

    ngOnChanges(changes: SimpleChanges){        
        this.getMessages();
    }

    ngOnInit(): void{

    } 

    private getMessages(){
        if(this.selectedConversation != undefined){
            this._messageService.getMessagesForConversation(this.selectedConversation.ConversationId).then(
                data => {
                    if (data) {
                        this.convoMessages = data.serviceResult as Array<Message>;
                    } else {
                        //This really should never happen
                        console.error('Error retrieving users data: Data object is empty');
                    }
                },
                error => {
                    //loader.dismiss();
                    console.error('Error retrieving users data');
                    console.dir(error);
                }
            );
        }
    }    

}

ngonchanges 将在 selectedConversation 第一次更改时触发。调用 GetMessages 并加载消息数据。之后，当 selectedConversation 更改时，ngonchanges 不再触发。

如果我注释掉对 getMessages 的函数调用，那么每次 selectedConversation 更改时都会触发 ngonchanges。

所以，我不确定 getMessages 中发生了什么会切断 ngonchanges 的触发。请求返回数据，调用结束。有人有想法么？

Answer 1

ngOnChanges 仅在@Input更改时触发reference，例如输入类型为string, boolean, number, 不可变对象。

假设[selectedConversation]绑定到一个数组arrSelected，如果你做类似arrSelected.push的事情，数组不会改变ref，所以 ngOnChanges 不会触发。

所以你需要使用不可变数组，使用concat,slice等来改变数组引用

Answer 2

请将您的组件更改为：

@Component({
    selector: 'conversation-detail',
    templateUrl: './conversation-detail.component.html',
    changeDetection: ChangeDetectionStrategy.Default
})

这对我来说很好。