Configure $stateParams and $state.go while using the WP-REST API

I am experimenting a basic application with the Wordpress API (WP-Rest Api), however I get stuck with $stateParams and $state.go, my goal is actually to create a state or a page that can show some more details. I am giving some of my code and hopefully get some good answers. The code is messed up tho.

list.html




{{x.id}}



app.js

.controller(‘listCtrl’, function($scope, $http, $state, $stateParams){

$http.get('http://loremipsum.net/cms/wp-json/wp/v2/posts')
.then(function(mydata){
$scope.mydata = mydata.data;
});
 
$scope.details = function(myId) {
$state.go('details',{myId: $scope.mydata})
};

})

.controller(‘detailsCtrl’, function($scope, $http, $state, $stateParams){
$http.get(‘http://loremipsum.net/cms/wp-json/wp/v2/posts/’ + $stateParams.id )
.then(function(myresponse){
$scope.myresponse = myresponse.data;

})})

.config(function($stateProvider, $urlRouterProvider){

$stateProvider.state ('list',{
	url:'/list',
	templateUrl:'templates/list.html',
	controller:'listCtrl',
})

$stateProvider.state ('details',{
	url:'/details:id',
	templateUrl:'templates/details.html',
	controller:'detailsCtrl',
})

$urlRouterProvider.otherwise('list');

})