Angular ui-sref不生成href链接

时间:2017-04-30 15:52:22

标签: angular-ui-router

我经历了很多与ui-sref相关的SO帖子没有正确生成,但它们似乎与我的问题无关,所以我发布了另一个。

我正在使用一个简单的导航栏,其中包含指向“欢迎”状态和“登录”状态的链接。 <a ui-sref>标记不会在浏览器中生成有效的href。检查时,只显示原始HTML。

应用/资产/模板/ nav.html

<nav class="navbar navbar-default" role="navigation">
<div class="container-fluid">
    <div class="navbar-header">
        <a ui-sref="welcome" class="navbar-brand">Hitch</a>
    </div>
    <ul class="nav navbar-nav pull-right">
        <li><a ui-sref="welcome">Home</a></li>
        <li ng-hide="signedIn()"><a ui-sref="login">Login | Register</a></li>
        <li ng-show="signedIn()"><a ng-click="logout()">Logout</a></li>
    </ul>
</div>

app.js

    (function () {
    function config($stateProvider, $locationProvider, $httpProvider, AuthProvider) {
        $locationProvider
            .html5Mode({
                enabled: true,
                requireBase: false
            });

        $stateProvider
            .state('welcome', {
                url: '/',
                controller: 'WelcomeCtrl as welcome',
                templateUrl: "welcome.html"
            })
            .state('login', {
                url: '/login',
                controller: 'AuthCtrl as auth',
                templateUrl: "login.html",
                onEnter: function(Auth, $state){
                    Auth.currentUser().then(function(){
                        $state.go('welcome')
                    })
                }
            })
            // other states


        $httpProvider
            .defaults.headers.common['X-CSRF-Token'] = $('meta[name=csrf-token]').attr('content');

    }   

    angular
        .module('hitch', ['ui.router', 'templates', 'ngResource', 'Devise', 'ui.bootstrap'])
        .config(config);
})();

NavCtrl.js

(function() {
function NavCtrl($scope, Auth, $rootScope) {

    this.signedIn = Auth.isAuthenticated;
    this.logout = Auth.logout;

    Auth.currentUser().then(function(user) {
        $rootScope.user = user;
        console.log(user);
    });

   // other functions 

};

angular
    .module('hitch')
    .controller('NavCtrl', ['Auth', '$rootScope', '$scope', NavCtrl]); })();

我通过application.html.erb将导航栏插入NavDirective.js

(function() {
function navBar() {
    return {
        templateUrl: 'nav.html',
        controller: 'NavCtrl'
    }
}

angular
    .module('hitch')
    .directive('navBar', [navBar])})();

当我尝试使用常规<a href>标记时,链接工作正常。我对Angular仍然相对较新 - 我的代码中是否存在导致ui-sref无法正常工作的明显错误?我该如何解决这个问题?

提前谢谢!

0 个答案:

没有答案