web-dev-qa-db-fra.com

Impossible d'obtenir une propriété de référence non définie ou nulle - Application Windows 8 JS/CSS

Ci-dessous, un extrait de mon code. L'erreur que j'obtiens est que, lorsque j'effectue une recherche et que j'appelle la méthode _searchData, celle-ci appelle avec succès la méthode _lookUpSuccess, mais renvoie ensuite l'erreur suivante:

Erreur d'exécution JavaScript: impossible d'obtenir la propriété '_displayResult' d'une référence non définie ou nulle

quand il essaie d'appeler la méthode _displayResult.

Pourquoi cela peut être? 

(function () {

    // make this an object property/method eventually
    var displayResult = function (queryResult) {
        for (var i = 0; i < holder.length; i++) {
            //document.querySelector(".item-content .title").textContent = "FilmApp";
            document.querySelector(holder[i]).textContent = queryResult[i];
       }};

    // Creates a new page control with members
    ui.Pages.define(searchPageURI, {
       //...
        _searchData: function (queryText) {
            searchBase          = 'http://www.example.com/web-service2.php?termID=';
            searchFormat        = 'JSON';
            searchFormatPiece   = '&format=' + searchFormat;

            if (!window.Data) {  
                var searchUrl = searchBase + queryText + searchFormatPiece;
                WinJS.xhr({ url: searchUrl }).done(this._lookUpSuccess, this._lookUpFail, this._lookUpProgress);
            }else{
                document.querySelector(".titlearea .pagetitle").textContent = "There has been a computer malfunction - sort it the **** out!";
            }
        },

        _lookUpSuccess: function xhrSucceed(Result) {
            var response = JSON.parse(Result.responseText);
                if (response.response[0].Message === "Found") {
                    for (var x in response.response[1].term) {
                        content.Push(response.response[1].term[x]);
                    };
                    this._displayResult(content);
                    //displayResult(content);
                    return content;
                } else {
                    content.Push("Not Found", "Not Found");
                    return content;
                }
         },

        _lookUpFail: function xhrFail(Result) { document.querySelector(".titlearea .pagetitle").textContent = "Got Error"; },
        _lookUpProgress: function xhrProgress(Result) { document.querySelector(".titlearea .pagetitle").textContent = "No Result 2"; },

        _displayResult: function (queryResult) {
            var holder;
            holder = [DefDiv, DescDiv];

            for (var i = 0; i < holder.length; i++) {
                //document.querySelector(".item-content .title").textContent = "FilmApp";
                document.querySelector(holder[i]).textContent = queryResult[i];
            };
        },

    });

    // End of UI.page.define    

    // #2 This method is run on application load
    WinJS.Application.addEventListener("activated", function (args) {
        if (args.detail.kind === appModel.Activation.ActivationKind.search) {
            args.setPromise(ui.processAll().then(function () {
                if (!nav.location) {
                    nav.history.current = { location: Application.navigator.home, initialState: {} };
                }
            return nav.navigate(searchPageURI, { queryText: args.detail.queryText });
            }));
        }
    });

    // #3 
    appModel.Search.SearchPane.getForCurrentView().onquerysubmitted = function (args) { nav.navigate(searchPageURI, args); };

})();
javascriptwindows-8
6
James

Dans cette ligne de code:

WinJS.xhr({ url: searchUrl }).done(this._lookUpSuccess, this._lookUpFail, this._lookUpProgress);

Vous transmettez _lookupSuccess en tant que fonction de gestionnaire done, mais lorsqu'elle est appelée, la valeur de this n'est plus celle que vous souhaitez, car elle sera définie par les éléments internes de tout ce qui appelle le gestionnaire done. Passer this._lookUpSuccess en tant que fonction ne fait que passer à la fonction. Il ne passe pas la valeur de this. Ainsi, lorsque this._lookUpSuccess est appelé avec la mauvaise this, toute référence à this à l'intérieur de celle-ci ne trouvera pas les propriétés attendues sur celle-ci (donc l'erreur que vous voyez).

Vous pouvez le réparer comme ceci, ce qui enregistre la valeur this dans une variable locale, puis l’utilise pour appeler _lookUpSuccess():

var self = this;
WinJS.xhr({ url: searchUrl }).done(function(result) {self._lookUpSuccess(result)}, this._lookUpFail, this._lookUpProgress);

Il s'agit d'un moyen très courant de rétablir la valeur this appropriée dans les rappels.

8
jfriend00

Dans:

this._displayResult(content);

Là, this est apparemment undefined ou null

2
Cerbrus