Angular ui.router Reload Template

First of all, I'm sorry for a long question, but it just has to be like that. Unfortunately...

I have a couple of templates and a couple of routing logic, all linked in separate files. For some reason the template I want to load (which depends on the region selected), doesn't load its region template. It loads, if I click it second time. Please note I have tried ever solution from this topic:

Reloading current state - refresh data

Nothing worked for me.

I have managed to resolve one (another region) of them by placing "{reload:true}" inline in the html code, like this:

<a data-ui-sref="uk-web" data-ui-sref-opts="{reload:true}">Energy Consultant</a>

Now I did the same for another template and it is not working. This is my html:

<div class="btn us-btn" data-ng-controller="carCtrlUs">
            <script type="text/ng-template" id="careersTplUs.html">
                <div class="closer">
                    <span class="close-me" data-ng-click="ok()">X</span>
                </div>
                <uib-accordion close-others="true">
                    <div uib-accordion-group class="modal-body modone panel-default pull-right" is-open="false">
                        <uib-accordion-heading>
                            <p class="car-heading">Sales Department <i class="pull-right glyphicon" ng-class="{'glyphicon-chevron-down': status.open, 'glyphicon-chevron-right': !status.open}"></i>
                            </p>
                        </uib-accordion-heading>
                        <ul>
                            <li><a data-ui-sref="us-web" data-ui-sref-opts="{reload:true}">Energy Consultant</a></li>
                            <li><a data-ui-sref="us-crm" data-ui-sref-opts="{reload:true}">Client Relationship Manager</a></li>
                        </ul>
                    </div>
                    <div class="modal-body modtwo panel-default pull-right" uib-accordion-group is-open="false">
                        <uib-accordion-heading>
                            <p class="car-heading">Marketing Department <i class="pull-right glyphicon" ng-class="{'glyphicon-chevron-down': status.open, 'glyphicon-chevron-right': !status.open}"></i>
                            </p>
                        </uib-accordion-heading>
                        <ul>
                            <li><a data-ui-sref="us-web" data-ui-sref-opts="{reload:true}">Web Developer</a></li>
                            <li><a data-ui-sref="us-crm" data-ui-sref-opts="{reload:true}">Marketing Coordinator</a></li>
                        </ul>
                </div>
        </uib-accordion>
    <div class="show-me" ui-view></div>
     </script> 
     <button class="btn" ng-click="open()" data-ui-sref="us-intro">United States</button>
</div>

app.js:

var app = angular.module('carApp', ['ngAnimate', 'ngSanitize', 'ui.bootstrap', 'ui.router']);

controller, for this template:

app.controller('carCtrlUs', function($scope, $http, $uibModal) {
    $http.get('json/jobs-us.json').then(function(response) {
        $scope.placeholder = response.data.default;
        $scope.specs = response.data.specs;

        $scope.open = function() {

            var modalContent = $uibModal.open({
                templateUrl: 'careersTplUs.html',
                controller : 'modalContentCtrlUs',
                controllerAs: '$ctrl',
                size: 'lg',
                backdropClass: 'backdropOver',
                openedClass: 'modal-opened',
                resolve: { 
                    items: function() { return $scope.specs; },
                    items2: function() { return $scope.placeholder;}
                }
            })
        console.log($scope.placeholder);
        console.log($scope.specs);
        console.log($scope.specs.web-dev);
        }
    });
});

app.controller('modalContentCtrlUs', function($scope, $uibModalInstance, items, items2) {
    $scope.specs = items;
    $scope.placeholder = items2;
    $scope.ok = function() {
        $uibModalInstance.close();
    }
});

factory.js:

app.config(['$stateProvider', '$urlRouterProvider', function($stateProvider, $urlRouterProvider) {
    $stateProvider
        .state("us-intro", {
            url:"/intro",
            templateUrl: "templates/us/start.html"
        })
    $stateProvider
        .state("us-web", {
            url: "/web-developer/",
            templateUrl: "templates/us/web-developer.html",
        })
        .state("us-crm", {
            url: "/crm/",
            templateUrl: "templates/us/crm.html"
        })
        /*next .state*/
}]);

Template:

<div ng-repeat="(k, v) in specs.webdev">
    <h3>{{::v["job-title"]}}</h3>
    <p>{{::v["job-body"]}}</p>
    United States Apply Here:
    <p>{{::v["job-apply"]}}</p>
</div>

As you can see I'm using ui-bootstrap (modal and accordion, since it is all in a modal window).

What can I do to make it refresh instantly? I'm stuck for days on this and it is frustrating... What am I doing wrong here?

EDIT: Please note that I know "::" is for one-way data binding. I've tried without it and the result is the same. I can probably resolve this by placing the data in question in the .json file, but that would really be an ugly hack.