无法访问具有"findIndex"函数的类变量 - 已解决

Question

我无法从findIndex方法访问我的类变量。

My whole class:
import { Component, Input, OnInit } from '@angular/core';
import { History } from '../model/history';
import { SharedService } from "../shared.service";
@Component({
selector: 'app-details',
templateUrl: './details.component.html',
styleUrls: ['./details.component.scss']
})
export class DetailsComponent implements OnInit {
history: History[] = [
{
basic_text: { basic_text: 'text_1' },
summary: { summary: 'summary_1' },
tager: { tag_algorytm: true, tag_text: "tag_1" }
},
{
basic_text: { basic_text: 'text_2' },
summary: { summary: 'summary_2' },
tager: { tag_algorytm: false, tag_text: "tag_2" }
}
];
basic_text: String = "Tekst podstawowy";
summary: String = "Streszczenie";
rating: String = "Ocenione zdania";
chosedText: string;
asd: string = 'asdad';
constructor(private sharedService: SharedService) { }
ngOnInit() {
this.sharedService.sharedMessage.subscribe(chosedText => this.chosedText = chosedText)
}
textFilter(h: History[]) {
let result: History[] = [];
var param = this.chosedText;
var foundIndex = h.findIndex(this.isEqualToSelectedText, param);
result.push(h[foundIndex])
return result;
}
// The function was moved out
private isEqualToSelectedText(element: History) {
return element.basic_text.basic_text === this.chosedText;
}
}

我给这个Arg赋值为choosedText。我得到的错误：

core.js:5967 ERROR TypeError: Cannot read property 'basic_text' of undefined
at DetailsComponent_tr_12_Template (details.component.html:11)
at executeTemplate (core.js:9274)
at refreshView (core.js:9143)
at refreshEmbeddedViews (core.js:10263)
at refreshView (core.js:9167)
at refreshComponent (core.js:10309)
at refreshChildComponents (core.js:8940)
at refreshView (core.js:9193)
at refreshComponent (core.js:10309)
at refreshChildComponents (core.js:8940)

但如果我做

var x= h.findIndex(isEqualToSelectedText, 'text_1');

一切都很好。我试图从isEqualToSelectedText函数访问我的类变量。但我总是犯这个错误。单词"；这个"；运行findIndex期间应等于'text_1'。你能帮我吗？

Answer 1

this将因为函数范围而丢失其引用。您可以使用箭头函数，这样它就可以保留其作用域，甚至可以将isEqualToSelectedText函数移到该类中的私有方法中。

可能是这样的：

// in the same place you're declaring the function
const isEqualToSelectedText = (element : History) => {
return element.basic_text.basic_text === this.chosedText;
}

// or moving out to a private method in the class
export class DetailsComponent implements OnInit {
history: History[] = [
{
basic_text: { basic_text : 'text_1' },
summary: { summary : 'summary_1' },
tager: { tag_algorytm : true, tag_text: 'tag_1' }
},
{
basic_text: { basic_text : 'text_2' },
summary: { summary : 'summary_2' },
tager: { tag_algorytm : false, tag_text: 'tag_2' }
}
];
chosedText: string = 'text_1';
textFilter(h: History[]) {
let result: History[] = [];
var param = this.chosedText;
var foundIndex= h.findIndex(this.isEqualToSelectedText, param); // <-- changing here
result.push(h[foundIndex])
return result;
}
// The function was moved out
private isEqualToSelectedText(element: History) {
return element.basic_text.basic_text === this.chosedText;
}
}

Answer 2

好的，我发现了错误。在变量被"0"初始化之前，我一直在使用它；http get"；。所以问题解决了，谢谢你的帮助。