Блог

Как использовать переменные, украшенные @ input, в дочерних компонентах при обмене данными между родительским и дочерним компонентами angular? Например, следующий код:

 @input str : string;
 

Затем я могу использовать ее в функции ngoninit():

 ngOnInit(): void {
console.log ("str is:",  this.str );
}
 

Он работает нормально, и я могу видеть содержимое в консоли.
Но если я хочу использовать эту переменную в другом месте в этом классе, например, в следующих функциях:

 private _ str : string;
strVal(){
this._ str= this.str ;
console.log ( str is:", this._ str);
}
 

Он может быть скомпилирован, но в консоли есть ошибка, а запрос «не определен».

Как решить подобные проблемы? Спасибо.

Вы должны использовать () для Input . Пример:

 @Input() data: string
 

Попробуйте написать @Input() str: string;

Также убедитесь, что функция strVal(); вызвана.

Простой способ проверить это — вызвать функцию в ngOnInit()

 ngOnInit(): void {
this.strVal();
}
 

Во-первых, чтобы избежать undefined проблемы, вы можете начать с присвоения вашему input значению по умолчанию.

 @Input()
str = 'default'; // Or you can just let it empty '' 
 

Почему у вас возникает undefined . В вашем коде я вижу

 console.log ( str is:", this._ str); // There is a " missing here
console.log ( "str is:", this._ str); // I think the undefined you are having,
// is not about the str input but about the "str" in this line where " was missing (str is:")