Cannot read property 'comments' of undefined error in angularjs

Question

I asked this question before too. Maybe someone can caught the error here.

.controller('DishDetailController', ['$scope', function($scope) {
    var dish={
        name:'Uthapizza',
        image: 'images/uthapizza.png',
        category: 'mains', 
        label:'Hot',
        price:'4.99',
        description:'A unique combination of Indian Uthappam (pancake) and Italian pizza, topped with Cerignola olives, ripe vine cherry tomatoes, Vidalia onion, Guntur chillies and Buffalo Paneer.',
        comments: [
            {
                rating:5,
                comment:"Imagine all the eatables, living in conFusion!",
                author:"John Lemon",
                date:"2012-10-16T17:57:28.556094Z"
            },
            {
                rating:2,
                comment:"It's your birthday, we're gonna party!",
                author:"25 Cent",
                date:"2011-12-02T17:57:28.556094Z"
            }
        ]
    };
    $scope.dish = dish;
}])
.controller('DishCommentController', ['$scope', function($scope) {
    $scope.newcomment = {
        rating : "",
        comment: "",
        author: "",
        date: new Date().toISOString()
    };
    $scope.submitComment = function () {
        $scope.newcomment.date = new Date().toISOString();
        $scope.newcomment.rating = parseInt($scope.newcomment.rating)
        console.log($scope.newcomment.comment);
        console.log($scope.newcomment.author);
        console.log($scope.newcomment.rating);
        console.log($scope.newcomment.date);
        $scope.dish.comments.push($scope.newcomment);
    }
}]);

In html part part I have only two-three textbox. SubmitComment in button onclick. Console.log show me the result which I need. But I cannot push this to array. The exercise is a part of tutorial. So it was requirement to write them in seperate controllers and this was provided by the tutorial

Possible duplicate of [Share data between AngularJS controllers](http://stackoverflow.com/questions/21919962/share-data-between-angularjs-controllers) — J. Titus, Feb 01 '17 at 13:19
@Craicerjack. Yes I have tried as that example, too. But nothing — , Feb 01 '17 at 13:49

score 0 · Answer 1 · answered Feb 01 '17 at 13:21

0

The dish object is not defined in the second controller which make sense from the error "undefined". You have to find a way to pass the dish object from the first controller "DishDetailController" to the second one "DishCommentController". There are several ways to do it, one way is to stock the object into service from the first controller then retrieve it from the same service in the second controller. As I know the best way to share objects between controlllers is via services.

answered Feb 01 '17 at 13:21

Sadok Mtir

585
6
15

Thanks for response I even newcomment part into the first Controller. I can access that from the second controller, too. But problem is that I still cannot push this to array. whatever I am doing I cannot push this to anohter one – Feb 01 '17 at 13:48

Cannot read property 'comments' of undefined error in angularjs

1 Answers1