Need more Clarification, whether both HTML are shown in same view or different on product click.
here is a Plunker i made understanding your question and comments.
https://plnkr.co/edit/Ii52KZkjpNndmAMvQQYU?p=preview
$scope.products = [{
ID: 'P1',
post_title: 'product 1',
post_date: '20th July 2016',
post_author: 'John Doe'
}, {
ID: 'P2',
post_title: 'product 2',
post_date: '29th July 2016',
post_author: 'Jane Doe'
}, {
ID: 'P3',
post_title: 'product 3',
post_date: '12th July 2016',
post_author: 'John William'
}];
$scope.selectedProduct = {};
$scope.selectProduct = function(index){
$scope.selectedProduct = $scope.products[index];
};
and here is the HTML
<div>
Product List
<div ng-repeat="product in products">
<ion-item>
{{product.post_title}}
<button ng-click="selectProduct($index)">select</button>
<br>
</ion-item>
</div>
</div>
<div ng-include="'product.html'"></div>
the other HTML will pick the same angular controller.
与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…