I'm having trouble pushing an object to an array. I'm trying to push the comments object (values from forms) on submit click, into dish.comments in dishDetailController. The ng-controller="DishCommentController" is nested inside ng-controller="dishDetailController". Any idea where I might be making a mistake?
main.html
<div class="row row-content" ng-controller="dishDetailController as menuCtrl">
<div class="col-xs-12">
<ul class="media-list">
<li class="media">
<div class="media-left media-top">
<a href="#">
<img class="media-object img-thumbnail"
ng-src={{menuCtrl.dish.image}} alt="Uthappizza">
</a>
</div>
<div class="media-body">
<h2 class="media-heading">{{menuCtrl.dish.name}}
<span class="label label-danger">{{menuCtrl.dish.label}}</span>
<span class="badge">{{menuCtrl.dish.price | currency}}</span></h2>
<p>{{menuCtrl.dish.description}}</p>
</div>
</li>
{{menuCtrl.dishes}}
</ul>
</div>
<div class="col-xs-9 col-xs-offset-1">
<div class="media-right"><h3 class="media-right">Customer Comments <small>Sort By:
<input type="text" ng-model="sort"></small></h3></div><br>
<ul ng-repeat="comments in menuCtrl.dish.comments | orderBy:sort">
<blockquote>
<div class="media-body">
<h3 class="media-heading">{{comments.rating}} Stars</h3>
<h4 class="media-heading"></h4>
<p>{{comments.comment }}</p>
<footer>{{comments.author}},<cite title="Source Title">{{comments.date | date:'MMM,dd,yyyy'}}</cite></footer>
<p><li></li></p>
</div>
</blockquote>
</ul>
</div>
<div class="col-xs-9 col-xs-offset-1" ng-controller="DishCommentController as comment">
<blockquote>
...
</blockquote>
<ul class="list-unstyled">
</ul>
<form class="form-horizontal" name="commentForm"
ng-submit="submitComment()" novalidate>
...
</form>
</div>
app.js
'use strict';
angular.module('confusionApp',[])
.controller('dishDetailController', ['$scope', function($scope) {
...
}])
.controller('DishCommentController', ['$scope', function($scope) {
...
}]