#angular #global-variables #local-variables
Вопрос:
У меня есть глобальный файл, в котором я храню все глобальные переменные, которые необходимо разделить между различными компонентами в angular
export class GlobalContext {
userData: any
setUserData(user) {
this.userData = user
}
}
и в моем компоненте я назначаю его локальной переменной, как показано ниже
import {GlobalContext} from './globalContext.ts';
export class CreateEditComponent implements OnInit {
favBook = [];
constructor(private readonly gc: GlobalContext){}
ngOnInit(): void {
favBook = this.gc.userData.favBook;
}
}
Здесь favBook-это массив как в глобальном файле, так и в компоненте.
Теперь, когда я использую favBook в своем компоненте и отправляю в него некоторые данные, как показано ниже
this.favBook.push('Test 123');
Глобальные данные в разделе userData.favBook также обновляются. Но здесь я пытаюсь обновить только локальную переменную внутри компонента. Только после подтверждения от пользователя я хочу обновить глобальную переменную.
Что это за вещь, которой мне не хватает, и как я могу дублировать глобальные данные в своем компоненте. Пожалуйста, помогите
Комментарии:
1. Сделайте клон вашего массива для присвоения локальной переменной —
favBook = [...this.gc.userData.favBook]
2. Большое спасибо @Sam. это сработало
Ответ №1:
При определении глобального значения вы создаете поверхностную копию, что означает, что и this.favBook
то, и другое, и this.gc.userData.favBook
ссылка на один и тот же адрес памяти. Вы можете прочитать дополнительную информацию об этом здесь.
Если вы хотите иметь отдельные значения, вам нужно создать глубокую копию. В этом случае JSON.parse(JSON.stringify(this.gc.userData.favBook))
, вероятно, сработало бы. Или оператор распространения с массивом, как это написано между тем в комментарии Сэма.