Using angular suggestions in html binded to controller in phpStorm

Question

I'm using phpStorm and was wandering weather I can bind HMTL template to controller to have propper suggestions.

In my router I have defined template HTML and contoller:

$stateProvider
        .state('app.import', {
            url: 'import/',
            views: {
                'page@app': {
                    templateUrl: '/app/import.html',
                    controller: 'importCtrl',
                    controllerAs: 'vm'
                }
            }
        })
    ;

In controller:

(function () {
    angular
        .module('app.import')
        .controller('importCtrl', importCtrl)
    ;


    /* @ngInject */
    function importCtrl(importService) {
        var vm = this;
        vm.metaDane = importService.getSources();
        vm.sources = importService.sources;
    }
})();

I want to use those variables in my html file with ctrl+space (now suggestions are global):

Something like:

<!-- @ngdoc controller importCtrl -->
<div>{{vm.}}</div>

Answer 1

Just use the $scope in the controller:

/* @ngInject */
function importCtrl($scope, importService) {
    $scope.vm = {};
    $scope.vm.metaDane = importService.getSources();
    $scope.vm.sources = importService.sources;
}

HTML:

<!-- @ngdoc controller importCtrl -->
<div>{{vm.metaDane}}</div>
<div>{{vm.sources}}</div>