Using ui-router in angularjs

I was working with ngRoute before I migrated to ui-router.

In my application I have this config :

myapp.config(function($stateProvider, $urlRouterProvider) {
  $stateProvider
    .state('home', {
      url: '/home',
      templateUrl: 'views/home.html'
    })
    .state('about', {
      url: '/about',
      templateUrl: 'views/about.html'
    })
    .state('contact', {
      url: '/contact',
      templateUrl: 'views/contact.html'
    })
    .state('work', {
      url: '/work',
      templateUrl: 'views/work.html'
    })
    .state('work.top_authors', {
      url: '/top_authors',
      templateUrl: 'views/work/top_authors.html',
      controller: 'topAuthorsController'
    })
    .state('work.articles_evolution', {
      url: '/articles_evolution',
      templateUrl: 'views/work/articles_evolution.html',
      controller: 'articlesEvolutionController'
    })
    .state('work.top_organizations', {
      url: '/top_organizations',
      templateUrl: 'views/work/top_organizations.html',
      controller: 'topOrganizationsController'
    })
    .state('work.words_cloud', {
      url: '/words_cloud',
      templateUrl: 'views/work/words_cloud.html',
      controller: 'wordsCloudController'
    })
    .state('work.authors', {
      url: '/authors',
      templateUrl: 'views/work/authors.html',
      controller: 'authorsController'
    })
    .state('work.words', {
      url: '/words',
      templateUrl: 'views/work/words.html',
      controller: 'wordsController'
    })
    .state('work.jobs_offers', {
      url: '/jobs_offers',
      templateUrl: 'views/work/jobs_offers.html',
      controller: 'JobOffersByCounteryController'
    });
  $urlRouterProvider.otherwise('/home');
});

for the first 4 states I have no problems, but with the others who are the work state childs I have this problem :

So, when I click on (for example) <a ui-sref="#/work/articles_evolution">Artciles Evolution</a> I get this error in console :

Error: Could not resolve '#/work/articles_evolution' from state 'work'

but When I type the link in the browser : http://localhost/dst-angular/app/#/work/articles_evolution it works without problem.

How can I resolve this ?

My second question is:

in the html page work I have <div ui-view></div> which will be replaced by the template in the ui-sref, I want this page to contain some content and then when I click on the ui-sref to replace this content when the new template is embedded.

How can I do that ?