Question

我想要完成的是在服务中扩展JSON对象，然后将其传递给控制器。

JSON从另一个进行后端呼叫的服务开始服务。

代码非常复杂，所以我添加了注释和console.logs：

    //get games config object from another service
    gamesConfig: gamesConfigService.gamesConfig(),

    // prepare name of games icons. This is support function executed in next method
    transformSpace: function(subject) {
        var ensuredSubject = subject.toString().toLowerCase();
        var transformedSubject = ensuredSubject.replace(/ /g, '_');
        return transformedSubject;
    },

    //add iconname property to game config object
    extendGameConfig: function() {

        var that = this;

        this.gamesConfig
        .then(function (response) {

            console.log(response.data); // this works and console.log my JSON

            response.data.map(function(obj) {

                return new Promise(function(res){
                    angular.extend(obj, {
                        iconname: that.transformSpace(obj.attributes.name) + "_icon.png"
                    });
                });

            });

        }, function () {
            console.log('errror');
        });

这包含一个支持方法transformSpace和主方法，它没有正确传递数据。（我认为）

我试图通过以下方式在控制器中接受这个承诺：

theService.getGamesObj.extendGameConfig()
    .then(function (response) {
        $scope.allGames = response;
        console.log($scope.allGames);
    }, function () {
        console.log('err')
    });

然后我会在视野中使用它。现在上面的代码不起作用，并给我以下错误：

TypeError：无法读取属性＆＃39;然后＆＃39;未定义的

Answer 1

我已经在我认为您的代码出错的地方添加了评论

extendGameConfig: function() {
    // ***********
    // use => functions, that = this wont be needed
    var that = this;
    // ***********
    // if you want this this function to return something, add a return 
    // this is why you get the 
    // Cannot read property 'then' of undefined error
    // as this function returns undefined
    this.gamesConfig
    .then(function (response) {

        console.log(response.data); // this works and console.log my JSON
        // ***********
        // you're using .map ... and discarding the result! 
        response.data.map(function(obj) {
            // ***********
            // you're creating a promise that never resolves!
            // also, why are you promisifying synchronous code?
            return new Promise(function(res){
                angular.extend(obj, {
                    iconname: that.transformSpace(obj.attributes.name) + "_icon.png"
                });
            });
        });
    }, function () {
        console.log('errror');
    });

所以，试试这个

extendGameConfig: function() {
    return this.gamesConfig
    .then(response => {
        return response.data.map(obj => {
            return angular.extend(obj, {iconname: this.transformSpace(obj.attributes.name) + "_icon.png"});
        });
    }, function () {
        console.log('errror');
    });

或者，更好的是

extendGameConfig: function() {
    return this.gamesConfig
    .then(response => 
        response.data.map(obj => 
            angular.extend(obj, {iconname: this.transformSpace(obj.attributes.name) + "_icon.png"})
        )
    )
    .catch(function (err) {
        console.log('error', err);
        throw err; // log the error, but you'll probably want to reject this promise so the calling code doesn't think there is success?
    });
}

将.map函数中的扩展对象从服务返回到控制器作为promise

1 个答案: