angular.module("mainApp")
    .config(function ($stateProvider, $urlRouterProvider) {
        $stateProvider
            .state("a", {
                url: '/a',
                templateUrl: 'app/a/a.html'
            })
            .state("b", {
                url: '/b',
                templateUrl: 'app/b/b.html'
            })
        
        
app/index.html:


....
<p ui-view></p>
....
        

ui-router mengawal halaman melalui state Khususnya, apabila halaman memuatkan ui-router dan konfigurasi router yang berkaitan (kod contoh di atas), ia akan mengikut bar alamat URL memuatkan templat yang sepadan contoh, jika laluan /a diakses, ui-router akan mengetahui bahawa laluan /a ini sepadan dengan a ini state, dan templatnya ialah app/a/a.html, dan kemudian ia akan Memuatkan templat ini dan memasukkannya ke dalam kedudukan ui-viewdirective (ini mungkin tidak sesuai, kerana negeri boleh diwarisi dan pandangan juga boleh bersarang, yang jauh sekali)

Adalah disyorkan untuk melihat dengan teliti wiki ui-router