Question

我正在研究一个问题库，我已经很好地编写了大部分元素，但是我想添加一些浏览器历史来导航问题。

所以这是plunker的基本设置： http://embed.plnkr.co/1F64dDrxVYfD8ScVGgac/preview

目前页面加载在/quiz下但我希望通过网址搜索

动态更改$scope.currentQ

/quiz?q=1

我玩过$ routeParams作为替代和$ location，但我似乎无法让它正常工作。有人可以帮助我吗？

// Code goes here

(function() {
    'use strict';

    var app = angular.module('questionbank', []);
    //////////////
    //Directives//
    //////////////
    app.controller('questionbankController', ['$scope', function($scope) {
        $scope.currentQ = 0;
        $scope.guess = [];
        $scope.SBAchoices = ['a', 'b', 'c', 'd', 'e'];
        $scope.questions = questions;
        $scope.prevQ = function() {
            if ($scope.currentQ !== 0) {
                $scope.currentQ--;
            }
        };
        $scope.nextQ = function() {
            if ($scope.currentQ < $scope.questions.length - 1) {
                $scope.currentQ++;
            }
        };
        $scope.submit = function(guess) {
        };
    }]);
    var questions = [{
    questionid: 1,
    question: "What year is it?",
    choices: [
        "2011",
        "2012",
        "2013",
        "2014",
        "2015"
    ],
    answer: "2015",
    reason: "Because it is not yet 2016!",
    category: "test"
}, {
    questionid: 2,
    question: "Which medical school is the best?",
    choices: [
        "Kings",
        "Imperial",
        "St. George's",
        "Barts",
        "UCL"
    ],
    answer: "UCL",
    reason: "Creators are from UCL, do I need to say any more?",
    category: "test2"
}];
})();

Answer 1

以下是基于$ location service http://run.plnkr.co/50SiWpwg1VEvLo2w/?q=1的导航示例（代码http://plnkr.co/edit/PZX9Td4y6EJEnLm2yK4H?p=preview的链接）。这是基于此事件导航工作的最简单方法：

$scope.$on('$locationChangeSuccess', function() {...})

使用$ routeParams或$ location for History Links

1 个答案: