【问题标题】：Routing issue in Angular ui-router using hrefAngular ui-router中使用href的路由问题
【发布时间】：2017-03-21 13:33:16
【问题描述】：

我已创建一个状态并尝试导航到其他页面。控制台没有错误，但导航也不起作用。

index.html

<body ng-app="app">
    <a href='#/first-msg'>link</a>
    <div ui-view></div>

    <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.3/angular.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.4.2/angular-ui-router.js"></script>
    <script src="application.js"></script>
</body>

应用程序.js

var app = angular.module('app', ['ui.router']);
app.config(['$stateProvider', '$locationProvider', function($stateProvider, $locationProvider) {
    $stateProvider.state('firstMessage', {
        url: '/first-msg',
        templateUrl: 'home.html',
        controller: 'homeCtrl'
    });
    $locationProvider.html5Mode({
        enabled: true,
        requireBase: false
    });
}]);
app.controller("homeCtrl", ['$scope', function($scope) {
    $scope.message = "This is home";
}]);

当我点击链接时，网址就像

.../index.html#%2Ffirst-msg

【问题讨论】：

标签： javascript angularjs routing angular-ui-router

【解决方案1】：

使用ui-router，你不应该使用href。请改用ui-sref：

<a ui-sref="firstMessage">link</a>

请注意，我使用的是州名，而不是其 URL。

JSFiddle demo

【讨论】：