Обновить область видимости внутри .then?

0

У меня есть функция внутри контроллера, и я смущен тем, как обновить переменную $ scope изнутри функции.then.

Вот моя функция:

searchSpotify(query, $scope) {
    this.Spotify.search(query,'track').then(function (data) {
        console.log(data.tracks.items); // this is working
        $scope.result = data;
  }); 
}

В журнале консоли я получаю эту ошибку:

TypeError: Cannot set property 'result' of undefined

Использовать ли значение $ scope. $?

РЕДАКТИРОВАТЬ:

Здесь весь контроллер для контекста

(function() {

    class SelectionController {
        constructor(User, groupService, selectionService, songService, $scope, $routeParams, Spotify) {
            this.groupId = $routeParams.groupId;
            this.selectionId = $routeParams.selectionId;
            this.groupService = groupService;
            this.selectionService = selectionService
                //this.selections = this.selectionService.getSelections();
            this.songService = songService;
            this.searchResults;
            this.$scope = $scope;
            this.Spotify = Spotify
        }

        searchSpotify(query) {
            this.Spotify.search(query, 'track').then(function(data) {
                console.log(data.tracks.items);
                $scope.result = data;
            });
        }

        addSong(name, artist, album) {
            alert('called from selection controller');
            this.songService.addSong(this.selectionId, name, artist, album);
        }

        createSelection(name, description) {
            this.selectionService.createSelection(this.groupId, name, description);
        }

        deleteSelection(selection) {
            this.selectionService.deleteSelection(selection);
        }
    }

    angular.module('songSelectionApp')
        .controller('SelectionController', SelectionController);

})();
  • 1
    Если эта функция находится в контроллере, не передавайте ей переменную $ scope.
  • 0
    функция, вызываемая к тому then как другая область видимости. Вы можете использовать функцию стрелки, если вы используете ES6, или bind()
Показать ещё 4 комментария
Теги:

3 ответа

2
Лучший ответ

Сохранить ссылку на $ scope:

    searchSpotify(query) {
        var $scope = this.$scope;
        this.Spotify.search(query, 'track').then(function(data) {
            console.log(data.tracks.items);
            $scope.result = data;
        });
    }

Или используйте функции стрелок:

    searchSpotify(query) {
        this.Spotify.search(query, 'track').then((data) => {
            console.log(data.tracks.items);
            this.$scope.result = data;
        });
    }

.bind(this) также должно работать, как предлагают другие ответы.

Что касается $scope.$apply: вам нужно это, только если вы хотите изменить $scope за пределами $digest, например, когда вы используете внешние (не угловые) библиотеки/функции, такие как WebSocket или прослушиватели событий jquery. Пока Spotify не является угловой услугой/фабрикой - вам не нужно $scope.$apply

Из документов:

$ apply() используется для выполнения выражения в угловом формате вне рамок. (Например, из событий браузера DOM, setTimeout, XHR или сторонних библиотек).

Поделиться
1

Вы должны использовать

this.Spotify.search(query,'track').then(function (data) {
    console.log(data.tracks.items); // this is working
    this.$scope.result = data;
}.bind(this));
Поделиться
1 
this.Spotify.search(query,'track').then(function (data) {
    console.log(data.tracks.items); // this is working
    this.result = data;
}.bind($scope));

Должно быть все, что нужно. Вы в основном говорите о внутренней сфере, что this действительно должно быть

Поделиться
  • 0
    Я полагаю, $scope не определен. Ваш пример будет работать, если вы передадите .bind(this.$scope)
  • 0
    мне пришлось использовать .bind (this. $ scope), чтобы эта опция работала

Ещё вопросы

Сообщество Overcoder
Наверх
Меню