Unable to insert a JSON object into an Array

Question

Unable to insert a JSON object into an Array

This might appear to be a duplicate, but it's not. None of the solutions I've tried have worked.

Within my angular module, I have a list:

this.checkedInterviews = []

Followed by a function that does the following:

var interviewModel = {
                        interviewId: self.pendingInterviews[i].id,
                        status: self.pendingInterviews[i].status,
                        location: self.pendingInterviews[i].location,
                        start: self.pendingInterviews[i].start,
                        hideCheck: null
                    };
 this.checkedInterviews.push(JSON.stringify(interviewModel));

The error message

Cannot read property 'push' of undefined

is returned. Any insights on what could be causing this issue?

javascript angularjs json

Answer 1

Answer №1

var checkedIntervews = []
var interviewModel = {};
checkedIntervews.push(JSON.stringify(interviewModel));
console.log(checkedIntervews);

(function arrayPush() {
this.checkedIntervews = [];
var interviewModel = {};
this.checkedIntervews.push(JSON.stringify(interviewModel));
console.log(this.checkedIntervews);
})();

You should consider attempting the following:

var checkedIntervews = []
var interviewModel = {};
checkedInterviews.push(JSON.stringify(interviewModel));
$scope.checkedInterviews = checkedInterviews; //In case AngularJS is being used since it's mentioned in the question

IMPORTANT: Make sure to utilize this if all of this code resides within the same function. It should work within the global scope as well. An IIFE is only used here to separate out the scopes.

The above snippet includes both scenarios described.

If you are unsure about what this refers to in your context, please clarify your question for better assistance.

Answer 2

var checkedIntervews = []
var interviewModel = {};
checkedIntervews.push(JSON.stringify(interviewModel));
console.log(checkedIntervews);

(function arrayPush() {
this.checkedIntervews = [];
var interviewModel = {};
this.checkedIntervews.push(JSON.stringify(interviewModel));
console.log(this.checkedIntervews);
})();

You should consider attempting the following:

var checkedIntervews = []
var interviewModel = {};
checkedInterviews.push(JSON.stringify(interviewModel));
$scope.checkedInterviews = checkedInterviews; //In case AngularJS is being used since it's mentioned in the question

IMPORTANT: Make sure to utilize this if all of this code resides within the same function. It should work within the global scope as well. An IIFE is only used here to separate out the scopes.

The above snippet includes both scenarios described.

If you are unsure about what this refers to in your context, please clarify your question for better assistance.

Answer 3

Answer №2

When using distinct functions, the reference to this in the second function corresponds to a separate object.

Answer 4

When using distinct functions, the reference to this in the second function corresponds to a separate object.

Answer 5

Answer №3

It appears that the second function is utilizing a different instance of this.

Within an Angular Module, you have the option to assign this to a certain variable and then attempt to retrieve it from the second function.

For example:

var vm = this;
vm.checkedInterviews = [];

Subsequently, within the function, you should access it like so:

vm.checkedInterviews.push();

Answer 6

It appears that the second function is utilizing a different instance of this.

Within an Angular Module, you have the option to assign this to a certain variable and then attempt to retrieve it from the second function.

For example:

var vm = this;
vm.checkedInterviews = [];

Subsequently, within the function, you should access it like so:

vm.checkedInterviews.push();

Answer 7

Answer №4

Give this a shot Check out this functional fiddle

  var myApp = angular.module('myApp',[]);

  function MyCtrl($scope) {
  $scope.checkedInterviews = [];
  $scope.pendingInterviews = [{'id':1,'status':'pending','location':'abc','start':'start'}];
  for(i= 0; i < $scope.pendingInterviews.length; i++){
      var interviewModel = {
                      interviewId: $scope.pendingInterviews[i].id,
                      status: $scope.pendingInterviews[i].status,
                      location: $scope.pendingInterviews[i].location,
                      start: $scope.pendingInterviews[i].start,
                      hideCheck: null
      };
      console.log(interviewModel);
      $scope.checkedInterviews.push(JSON.stringify(interviewModel));
    }
  console.log($scope.checkedInterviews);
}

Answer 8

Give this a shot Check out this functional fiddle

  var myApp = angular.module('myApp',[]);

  function MyCtrl($scope) {
  $scope.checkedInterviews = [];
  $scope.pendingInterviews = [{'id':1,'status':'pending','location':'abc','start':'start'}];
  for(i= 0; i < $scope.pendingInterviews.length; i++){
      var interviewModel = {
                      interviewId: $scope.pendingInterviews[i].id,
                      status: $scope.pendingInterviews[i].status,
                      location: $scope.pendingInterviews[i].location,
                      start: $scope.pendingInterviews[i].start,
                      hideCheck: null
      };
      console.log(interviewModel);
      $scope.checkedInterviews.push(JSON.stringify(interviewModel));
    }
  console.log($scope.checkedInterviews);
}

Unable to insert a JSON object into an Array

Answer №1

Answer №2

Answer №3

Answer №4

Similar questions

Refreshing iOS UiCollectionView with a custom UiCollectionViewLayout

A guide to toggling the check/uncheck status of a list box by clicking on a checkbox using

How can I design a trapezoid with see-through borders and background?

Adjust puppeteer window dimensions when running in non-headless mode (not viewport)

Encountering difficulties with the functionality of Google Places API

The function signature '() => void' cannot be assigned to a variable of type 'string'

Ways to restrict a JavaScript object from being sent through ajax requests

Unable to view the refreshed DOM within the specifications after it has been altered

Utilize the synchronization feature of ES6 Promises in Jasmine with the then/catch method

Limiting input to specific characters is effective on Chrome, but unfortunately does not function on Firefox

Exploring techniques to iterate through this specific JSON data within an Angular frontend

Creating objects in separate JavaScript files and including them in the main file, along with their

Activate lightbox on click to swap image source temporarily

What is the best way to establish and concentrate on a fresh component in AngularJS?

Stop the child component from activating the parent's onClick event

Obtaining the decoded JSON value

Angular 8 does not allow for the assignment of type '{}' to a parameter

Manipulating Objects and Arrays

What is the method for a Greasemonkey script to divide a link into three interconnected links?

Choosing several buttons in typescript is a skill that every programmer must possess