Самый простой и, на мой взгляд, правильный способо - директивы. Вы можете изолировать все что связано с одним постов внутри директивы.
<x-single-post post="post" ng-repeat="post in posts"></x-single-post>
Внутри этой директивы вы можете уже выводить комментарии, у вас есть доступ к самому посту и т.д. Проблему со спиннерами можно решить через сервисы - передавать делегат директивы внутрь другой... или общаться через контроллеры... тут уже масса вариантов, кому как больше нравится.
Если вы используете angular 1.4 то директива будет выглядеть как-то так:
function singlePostViewDirective () {
return {
templateUrl: 'post.template.html',
bindToController: {
data: '=post'
},
controller: function () {
var vm = this;
vm.addComment = function (comment) {
// do stuff
}
},
controllerAs: 'post'
}
}
ну и в шаблоне будет что-то в духе
<form ng-submit="post.addComment(commentText)">
<textarea ng-model="commentText"></textarea>
<input type="submit" />
</form>
Ну можно еще на директивы подробить, тут как вам удобнее. Скажем форму добавления комментария можно в еще одну директиву запихнуть, которая будет только управлять UI и делигировать через колбэки само сохранение на уровень выше... Соль в том что бы разбить все на директивы соблюдая принципы единой ответственности и уменьшая между ними связанность (конечно надо соблюдать баланс, иначе для простой задачи можно нагородить много чего лишнего), тогда будет меньше боли.
