For example, if I want several page of states have the same tab bar, I can do this:
.state('tabs', {
url: "/tab",
abstract: true,
templateUrl: "templates/tabs.html",
controller:function(){
console.log('tabs');
}
})
.state('tabs.home', {
url: "/home",
views: {
'home-tab': {
templateUrl: "templates/home.html",
controller: 'HomeTabCtrl'
}
}
})
but I found I can also use ng-include to import a common UI:
templates/home.html
<ng-include src='templates/tab.html'></ng-include>
My question is, in order to have common UI in different states, when should I use abstract state and when to use ng-include?