angular/javascript无法识别函数内部的全局变量

angular/javascript not recognizing global variable inside function

本文关键字：函数 内部 全局变量 识别 javascript angular      更新时间：2023-09-26

我做了一项服务，从omdbapi中获取电影信息，但当我试图从控制器中使用它并将结果推送到电影数组时，它会抱怨

TypeError:无法读取未定义的属性"push"

.controller('AppCtrl', function(omdbApi) {
    this.movie = [];
    this.getMovie = function(title, year) {
        year = typeof year === 'undefined' ? "" : year;
        omdbApi.getMovie(title, year).then(function(data){
            this.movie.push({
                poster: data.data.Poster,
                title: data.data.Title,
                actors: data.data.Actors,
                plot: data.data.Plot
            });
        });
    }
});

有人能解释一下为什么它不能推送电影吗？我不确定这是一个角度问题，但从javascript的角度来看，我真的不明白。我已经测试了传入数据的合法性。如果我只是将数据分配给电影，那么我就无法在函数之外访问它。

这是一个常见的错误。.then()回调中的this对象不引用.controller()回调的同一对象。使用闭包：

.controller('AppCtrl', function(omdbApi) {
    var self = this; // <---- this is the key
    this.movie = [];
    this.getMovie = function(title, year) {
        year = typeof year === 'undefined' ? "" : year;
        omdbApi.getMovie(title, year).then(function(data){
            self.movie.push({
                poster: data.data.Poster,
                title: data.data.Title,
                actors: data.data.Actors,
                plot: data.data.Plot
            });
        });
    }
});

另一种选择是使用Function.prototype.bind()来强制创建上下文。

相关文章：