I am building a basic app (with MEAN web frameworks and node webkit) in order to understand angularjs better.
Here is the content of my 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);
I call the TopBarDismiss()
function in an HTML template using:
<div class="fooDismiss" ng-click="notificationFactory.TopBarDismiss(message)">Dismiss</div>
When I check out the console after pressing my Dismiss "button", I get this:
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
so it must be the
$.each(fooMessages, function (i, v) {
if (v.id == message.id) {
}
});
part that is quite horrible.
Can you, guys, spot the error for me, please?
First, as said in the comments, you need to make sure the message
object passed is really the one you're looking for.
Then, if you just want to splice you can do:
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);
}
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With