AngularJS ng-click vs ui-sref transition

时间:2015-11-18 15:20:12

标签: angularjs angular-ui-router

我正在尝试将用户从目标网页转换为用户页面。它适用于ui-sref。但是,如果我将其更改为ng-click="go('menu.home')",它将停止工作。当我点击链接时,它什么也没做。是否有某种我缺少的选项/设置?

状态

.state('menu', {
        url: '/menu',
        abstract: true,
        views: {
            "header@": {
                templateUrl: '/Navigation/AuthenticateHeader',
                controller: 'AuthenticateHeader'
                //    function ($scope) {
                //    $scope.message = 'Navigation Header.'
                //}
            },
            "content@": {
                templateUrl: '/Landing/Home',
                controller: function ($scope) {
                    $scope.message = 'Home page';
                }
            },
            'landingnav@menu': {
                templateUrl: '/Landing/AuthHeader',
                controller: function ($scope) {
                    $scope.message = 'Landing Header';
                }
            },
            'landingcontent@menu': {
                templateUrl: '/Landing/Index',
                controller: function ($scope) {
                    $scope.message = 'Landing Header';
                }
            }

        }
    })
    .state('menu.home',
    {
        url: '/home',
        views: {
            'landingnav@menu': {
                templateUrl: '/Landing/AuthHeader',
                controller: function ($scope) {
                    $scope.message = 'single message';
                }
            },
            'landingcontent@menu': {
                templateUrl: '/Landing/Index',
                controller: function ($scope, UserOptionsFactory) {
                    var options = UserOptionsFactory.CheckOptions;
                    console.log(options);
                    if (options !== null) {
                        $scope.isAdministrator = options.isAdministrator;
                    }
                }
            }
        }
    })

与ui-sref和ng-click的链接

<li ng-click="go('menu.home')">
    <i class="fa fa-5x fa-User"></i>
    <span>User</span>
</li>

<li>
    <a ui-sref="menu.home">
        <i class="fa fa-5x fa-User"></i>
        <span>User</span>
    </a>
</li>   

1 个答案:

答案 0 :(得分:1)

您需要在控制器中调用UI-Route <script type="text/javascript" src="https://www.google.com/jsapi"></script> <form id="form"> <input id="number1" type="number" min="1" name="number"> <input id="number2" type="number" min="1" name="number"> <button type="button">Submit</button> </form> <div id="pacman" style="width: 600px; height: 400px;"></div>函数,而不是HTML。

UI-SREF

根据UI-Routergo是指令。当您将ui-srefui-sref标记绑定时,它会为您指定转换绑定并自动触发您指定的状态。在您的情况下,它将转换为<a>。这就是使用menu.home为您服务的原因。

$ state.go()

ui-sref = menu.home是一个必须在控制器,服务和其他JS文件中触发的函数,而不是HTML。如果要在控制器端进行性能状态转换,则需要将$state.go()注入控制器。

HTML

$state

Controller.js

<li ng-click="go('menu.home')">
  <i class="fa fa-5x fa-User"></i>
  <span>User</span>
</li>