web-dev-qa-db-fra.com

"Impossible de lire la propriété 'de indéfinie" lors de l'analyse d'un tableau déclaré dans une fabrique

Je construis une application de base (avec des cadres web MEAN et un nœud webkit) afin de mieux comprendre angularjs.

Voici le contenu de mon notificationFactory.js

function notificationFactory() {

    var fooMessages = [

        {
            id: 4,
            dismissable: true,
            name: "fooooBaaar",
            function: '',
            showInTopBar: false,
            priority: "high",
            icon: 'fooIconBarBarBar',
            topBarIcon: 'fooIconIconIcon'
        },

        {
            id: 3,
            dismissable: true,
            name: "foofooBarBar",
            function: '',
            showInTopBar: false,
            priority: "high",
            icon: 'fooIconfooIcon',
            topBarIcon: 'IconIconIcon'
        },

        {
            id: 2,
            dismissable: true,
            name: "foo foo",
            function: '',
            showInTopBar: false,
            priority: "high",
            icon: 'fooBaaaaaar',
            topBarIcon: 'IconFooIcon'
        },

        {
            id: 1,
            dismissable: true,
            name: "foo",
            function: '',
            showInTopBar: false,
            priority: "high",
            icon: 'fooIcon',
            topBarIcon: 'fooIconIcon'
        },
    ]

    fooMessages.TopBarDismiss = function (message) {
        $.each(fooMessages, function (i, v) {
            if(v.id = message.id) {
                fooMessages.splice(i,1);
            }
        });

    }

    return fooMessages;

}

angular.module('fooDemo').factory('notificationFactory', notificationFactory);

J'appelle la fonction TopBarDismiss() dans un modèle HTML à l'aide de:

<div class="fooDismiss" ng-click="notificationFactory.TopBarDismiss(message)">Dismiss</div>

Lorsque je consulte la console après avoir appuyé sur mon "bouton" Dismiss, je reçois ceci:

 TypeError: Cannot read property 'id' of undefined
at notificationFactory.js:94
at Function.m.extend.each (jquery.min.js:2)
at Array.fooMessages.TopBarDismiss (notificationFactory.js:93)
at fb.functionCall (angular.js:10847)
at angular-touch.js:472
at k.$get.k.$eval (angular.js:12702)
at k.$get.k.$apply (angular.js:12800)
at HTMLDivElement.<anonymous> (angular-touch.js:471)
at angular.js:3097
at r (angular.js:325)angular.js:10072 (anonymous function)angular.js:7364 $getangular.js:12802 $get.k.$applyangular-touch.js:471 (anonymous function)angular.js:3097 (anonymous function)angular.js:325 rangular.js:3096 r.triggerHandlerangular.js:3111 S.(anonymous function)angular-touch.js:453 (anonymous function)angular.js:2853 (anonymous function)angular.js:325 rangular.js:2852 c

donc ça doit être le 

$.each(fooMessages, function (i, v) {
    if (v.id == message.id) {
    } 
});

partie qui est assez horrible.

Pouvez-vous, les gars, repérer l'erreur pour moi, s'il vous plaît?

javascriptjqueryangularjsangularjs-scope
6
George Netu

Tout d'abord, comme indiqué dans les commentaires, vous devez vous assurer que l'objet message transmis est bien celui que vous recherchez.

Ensuite, si vous voulez juste épisser, vous pouvez faire:

fooMessages.TopBarDismiss = function (message) {
        var index;
        for (var i = 0; i < fooMessages.length; i++) {
            if(fooMessages[i].id == message.id) {
                index = i;
                break;
            }
        }
        if (index) {
              fooMessages.splice(index,1);
        } 

}
6
Omri Aharon

Je pense que vous devez passer message à la fonction interne. Dans cette étendue, message est undefined.

0
marcieng