I want to create a calendar using AngularJS, and my model is an object like this:

$scope.model = {
        weeks: [
                {
                    days: [
                    null,
                    {
                        name: "3 dec",
                        toDoItems: [{ name: "Task 1" }, { name: "Task 2"}]
                    },
                    {
                        name: "4 dec",
                        toDoItems: [{name: "Task 1"}, {name: "Task 2"}]
                    }
                ]
                },
                {
                    days: [
                    null,
                    {
                        name: "5 dec",
                        toDoItems: [{ name: "Task 1" }, { name: "Task 2"}]
                    },
                    {
                        name: "6 dec",
                        toDoItems: [{name: "Task 1"}, {name: "Task 2"}]
                    }
                ]
                }

            ]
           }

But I want to create the object dynamically.

I've tried something like this, but it gives me the following error:

TypeError: Cannot call method 'push' of undefined



 $scope.fillMonth = function () {
        var gap = dayInWeek($scope.year.value, $scope.month, 1),
            nrOfDays = daysInMonth($scope.year.value, $scope.month);

        $scope.model = {};

        for (var i = 0; i < (nrOfDays + gap) % 7; i++) {
            for (var j = 0; j < 7; j++) {
                if (j === 0)
                    $scope.model.weeks.push([]);

                if (i === 0 && j < gap)
                    $scope.model.weeks[i].days.push(null);

                else
                    $scope.model.weeks[i].days.push([{ name: i + ' ' + j, toDoItems: [{ name: "Task 1" }, { name: "Task 2"}]}]);
            }
        }
    }

Can anyone help me with this? Thanks in advance!

I want to create a calendar using AngularJS, and my model is an object like this:

$scope.model = {
        weeks: [
                {
                    days: [
                    null,
                    {
                        name: "3 dec",
                        toDoItems: [{ name: "Task 1" }, { name: "Task 2"}]
                    },
                    {
                        name: "4 dec",
                        toDoItems: [{name: "Task 1"}, {name: "Task 2"}]
                    }
                ]
                },
                {
                    days: [
                    null,
                    {
                        name: "5 dec",
                        toDoItems: [{ name: "Task 1" }, { name: "Task 2"}]
                    },
                    {
                        name: "6 dec",
                        toDoItems: [{name: "Task 1"}, {name: "Task 2"}]
                    }
                ]
                }

            ]
           }

But I want to create the object dynamically.

I've tried something like this, but it gives me the following error:

TypeError: Cannot call method 'push' of undefined



 $scope.fillMonth = function () {
        var gap = dayInWeek($scope.year.value, $scope.month, 1),
            nrOfDays = daysInMonth($scope.year.value, $scope.month);

        $scope.model = {};

        for (var i = 0; i < (nrOfDays + gap) % 7; i++) {
            for (var j = 0; j < 7; j++) {
                if (j === 0)
                    $scope.model.weeks.push([]);

                if (i === 0 && j < gap)
                    $scope.model.weeks[i].days.push(null);

                else
                    $scope.model.weeks[i].days.push([{ name: i + ' ' + j, toDoItems: [{ name: "Task 1" }, { name: "Task 2"}]}]);
            }
        }
    }

Can anyone help me with this? Thanks in advance!

• javascript
• angularjs

Share Improve this question Follow asked Sep 30, 2013 at 15:42 TenziTenzi 10111 gold badge66 silver badges1212 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 6

the problem is that weeks does not exist. You need to create it first like so:

$scope.model = {};//new object
$scope.model.weeks = [];//new array

After that you do not want to push an empty array, instead push a new object that contains a days array:

var weeksObj = {};//new object
weeksObj.days = [];//new array
$scope.model.weeks.push(weeksObj);

You can then push your days values like so, for null:

weeksObj.days.push(null);

and for your days object, again create a new object:

var dayObj = {};//new object
dayObj.name = "name";//set name property
dayObj.toDoItems = [];//new array
weeksObj.days.push(dayObj);

Hopefully that will help you see where your problems are. It seems you are getting mixed up a bit between an object ({}) and an array ([]). Only arrays have the push method

In your loop do not push an empty array but set weeks to an empty array. and do not forget to create first object with day

    for (var i = 0; i < (nrOfDays + gap) % 7; i++) {
        for (var j = 0; j < 7; j++) {
            if (j === 0)
                $scope.model.weeks = [];

            if (i === 0 && j < gap)
                $scope.model.weeks[i] = {day: [null]};

            else
                $scope.model.weeks[i].days.push([{ name: i + ' ' + j, toDoItems: [{ name: "Task 1" }, { name: "Task 2"}]}]);
        }
    }