Passing parameters data to controller with Angular ui router state <p>I was using $httpBackend and the way I followed code examples I ended up feeling very trapped and cornered ... I had no idea how to make additional ajax calls from my controller as it httpBackend shut down further request.</p> <p>Anyways. I'm using this UI-Router in which the code was heavily relying on this deviceResource which was tied into use the $httpBackend . </p> <p>All i want to do is to pass a parameter to my controller ( it in also in the url </p> <p><strong>OLD CODE</strong></p> <pre><code> .state("deviceDetail", { url: "/devices/:DeviceId", // param is required which specific device id templateUrl: "app/devices/deviceDetailView.html", // ui elements controller: "DeviceDetailCtrl as vm" //, // as with alias of vm resolve: { // resolve is a property of the stateconfiguration object deviceResource: "deviceResource", // key value pair Key is deviceResource value is string name of "deviceResource" device: function (deviceResource, $stateParams) { // $stateParams service is needed because url: has this :DeviceId var DeviceId = $stateParams.DeviceId; return deviceResource.get({ DeviceId: DeviceId }).$promise; // function returns the promise } } }) </code></pre> <p><strong>Current Code</strong></p> <pre><code> .state("deviceDetail", { url: "/devices/:DeviceId", // param is required which specific device id templateUrl: "app/devices/deviceDetailView.html", // ui elements controller: "DeviceDetailCtrl as vm", function($scope,$stateParams) { $scope.DeviceId = $stateParams.DeviceId; } }) </code></pre> <p><strong>How do I pass data to controller?</strong> 1. $scope.DeviceId ? ( doesn't work ) 2. $state ?</p> <p><strong>Controller code</strong></p> <pre><code>angular .module("deviceManagement") .controller("DeviceDetailCtrl", ["$scope", "$http", "$state", DeviceDetailCtrl]); function DeviceDetailCtrl($scope, $http, device, $state) { console.log($scope.DeviceId); console.log($scope); console.log($state); ///... } </code></pre>