如何在HTML中使用使用錨與UI路由器

我用角UI路由器，就像如何在HTML中使用使用錨與UI路由器

.state('home', { 
     url: '/home', 
     templateUrl: 'view/home/home.html', 
     controller: 'homeCtrl' 
    }) 
.state('guide', { 
     url: '/guide', 
     templateUrl: 'view/guide/guide.html', 
     controller: 'guideCtrl' 
    })

，我可以在瀏覽器的URL訪問，http://localhost:8000/dist/#/home 但是，我不能用一個錨我HTML 如果在一個home.html的錨這樣

<a href="#aaa">scroll to aaa</a> 
.... 
<h1 id="aaa">AAA</h1>

當我點擊「滾動到AAA」，將URL http://localhost:8000/dist/#/aaa 並返回home.html的空白PAGE電泳錨不起作用。

我該如何解決這個問題？

來源

2016-03-28 PurpleCraw

你想要發生什麼？重定向到外部網站？或者在你的應用程序中的默認路線？ – henrikmerlander

這不是UI路由器問題，這是因爲base標記。您應該在#id之前的href中添加當前頁面路徑。試試這個：（我沒有測試過）

<a ui-sref="state_of_current_page" href="#your_id">link to id</a>

資源： tutsplus article about base tag related question in SO

來源

2016-03-30 10:22:23

我按照您的建議嘗試過.' link to foo'但是，它不起作用。 – PurpleCraw

請確保您有一個UI路由器版本比0.2.14更新的，這是第一個版本支持ui-router中的html錨點。所有版本都可以找到on github，我首先注意到了it was supported。

鑑於你的路由設置：

.state('home', { 
    url: '/home', 
    templateUrl: 'view/home/home.html', 
    controller: 'homeCtrl' 
}) 
.state('guide', { 
    url: '/guide', 
    templateUrl: 'view/guide/guide.html', 
    controller: 'guideCtrl' 
})

創建的任何視圖的鏈接：

<a href="" ui-sref="home({'#': 'aaa'})">Scroll to AAA</a>

在頁面視圖/家庭/ home.html的

.... 
.... 
<h1 id="aaa">AAA</h1>

來源

2016-09-23 23:34:42 Fredrik

使用ui-SREF以及href標籤。 href用於指向頁面的本地ID。 ui-sref應指向同一頁面的狀態。例如，

<a href="myId" ui-sref="stateOfCurrentPage"> any Link </a>

這將使頁面滾動到requires元素而不添加任何內容到您的url。

使用語法如

ui-sref="home({'#': 'aaa'})"

將導致做工作，但將哈希添加到URL。這在使用其他框架（如jQuery）時也會產生語法錯誤。

來源

2018-01-13 14:09:58

如何在HTML中使用使用錨與UI路由器

回答

相關問題