简体   繁体   中英

Load a ui-router state when website first loads

js for creating two layout and a content page is:

 $urlRouterProvider.otherwise("/Site/Movies");


    $stateProvider
      .state('admin', {
          url: "/Admin",
          templateUrl: "/Views/Admin.html"
      })
      .state('site', {
          url: "/Site",
          templateUrl: "/Views/Site.html"
      })          
      .state('site.movies', {
          url: "/Site/Movies",
          templateUrl: "/Views/Site/movies.html",
          controller: 'moviesController'
      })

Index.html is:

 <!DOCTYPE html> <html ng-app="moviesApp"> <head></head> <body ng-cloak> <!--<div class="container-fluid"> <ng-view></ng-view> </div>--> <div ui-view></div> <a ui-sref="site.movies">State 1</a> </body> </html>​ 

That I removed script references. Site.html is:

  <header id="siteHeader">HEADER</header> <div ui-view></div> <footer id="siteFooter">FOOTER</footer>​ 

and movies.html

 <div> <h1>List Movies</h1> <button ng-click="getMovies()">Get Movies</button> <span>{{error}}</span> <table class="table table-bordered table-striped"> <thead> <tr> <th></th> <th>Title</th> <th>Director</th> </tr> </thead> <tbody> <tr ng-repeat="movie in movies"> <td> <a href="/movies/edit/{{movie.Id}}" class="btn btn-default btn-xs">edit</a> <a href="/movies/delete/{{movie.Id}}" class="btn btn-danger btn-xs">delete</a> </td> <td>{{movie.Title}}</td> <td>{{movie.Director}}</td> </tr> </tbody> </table> <p> <a href="/movies/add" class="btn btn-primary">Add New Movie</a> </p> </div>​ 

My problem is only when I click the link with sref="site.movies" it appears and not on page load, How do I make movies.html and its layout load site runs first. also when I type /site/movies in the address bar movies.html does not load.

I found the solution is in nested state url:

.state('site.movies', {
      url: "/Site/Movies",
      templateUrl: "/Views/Site/movies.html",
      controller: 'moviesController'
  })

should be:

.state('site.movies', {
      url: "/Movies",
      templateUrl: "/Views/Site/movies.html",
      controller: 'moviesController'
  })

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM