AngularJS 1.6.1, TypeScript, UI Bootstrap Modal: Почему мои глобальные переменные, хранящиеся в хранилище сеансов, обновляются модалом?

Пожалуйста, помогите новичку. я использую ngStorage хранить некоторые глобальные переменные:

//Global Controller
saveGlobalSettings = () => {
        this.$sessionStorage.QuoteTimes = this.quoteTimes;
        this.$sessionStorage.QuoteTypes = this.quoteTypes;
    };

Я использую другой метод в другом контроллере для создания объектов, которые используют некоторые глобальные переменные в качестве свойств:

// Create Controller 
addChannel = (channel) => {            
        channel.QuotingChannelType = channel.QuotingChannelId;             
        console.log(this.$sessionStorage.QuoteTimes);
        channel.QuoteTypes = this.$sessionStorage.QuoteTypes;
        channel.QuoteTimes = this.$sessionStorage.QuoteTimes;
        if (!this.myChannels) { this.myChannels = []; }
        this.myChannels.push(channel);           
    };

Я тогда использую ng-repeat отображать объекты в myChannels в браузере. При нажатии я передаю объект openDialog() метод:

 openPreferencesDialog = (channel) => {
        var options: ng.ui.bootstrap.IModalSettings = {
            templateUrl: 'app/form/templates/editChannelPreferences.html',
            controller: 'EditDialogController',
            controllerAs: '$ctrl',
            resolve: {
                channel: () => channel
            }
        };            
        this.$uibModal.open(options).result
            .then(updatedChannel => console.log(updatedChannel));               
    };

Диалог открывается, как и ожидалось, но когда я делаю изменения, он обновляет QuoteTimes а также QuoteTypes массивы в $sessionStorage (видно из console.log в addChannel). Таким образом, каждый новый созданный объект имеет QuoteTimes а также QuoteTypes последнего объекта, который я редактировал. Я полностью в тупике. Мое лучшее предположение, что это какая-то проблема с цепью видимости? Есть идеи, что я делаю не так?

ОБНОВЛЕНИЕ: я смог заставить это работать как ожидалось, используя JSON.parse(JSON.stringify(obj)); следующее:

openPreferencesDialog = (obj, index) => {           
        var channel = JSON.parse(JSON.stringify(obj));
        var options: ng.ui.bootstrap.IModalSettings = {
            templateUrl: 'app/form/templates/editChannelPreferences.html',
            controller: 'EditDialogController',
            controllerAs: '$ctrl',
            resolve: {
                channel: () => channel
            }
        };            
        this.$uibModal.open(options).result
            .then(updatedChannel =>
            {
                console.log(updatedChannel);
                this.$sessionStorage.myChannels[index].QuoteTimes = updatedChannel.QuoteTimes;
                this.$sessionStorage.myChannels[index].QuoteTypes = updatedChannel.QuoteTypes;
                console.log(this.$sessionStorage.myChannels)
            });               
    };

Кто-нибудь может объяснить, почему это работает?

1 ответ

Если кавычка... члены объекта канала не примитивного типа, это нормальное поведение. Поскольку они являются ссылочным типом, то и последний отредактированный объект канала, и $sessionstorage имеют одинаковые ссылки на них в памяти.

Другие вопросы по тегам