Question

我已经设置了

function ($routeProvider) {
    $routeProvider
        .when('/', {
            templateUrl: 'views/pages/home.html',
            controller: 'HomeController'
        })
        .when('/terms', {
            templateUrl: 'views/pages/terms/terms.html',
            controller: 'TermsController'
        })
        .when('/patients/:patientId/schedule/daily', {
            templateUrl: 'views/pages/schedule/schedule.html',
            controller: 'ScheduleHomeController'
        })
        .when('/patients/:patientId/schedule/complex', {
            templateUrl: 'views/pages/schedule/schedule.html',
            controller: 'ScheduleHomeController'
        })
        .when('/error', {
            templateUrl: 'views/pages/error.html',
            controller: 'HomeController'
        })
        .otherwise({
            redirectTo: '/error'
        });

我有一些链接：

            <li class="anchor" data-ng-class="{'current-pg':model.schedulePage==='daily-schedule'}">
                <a href="#/patients/{{ model.currentPatient.patientId }}/schedule/daily">Daily</a>
            </li>
            <li data-ng-class="{'current-pg':model.schedulePage==='complex-schedule'}">
                <a href="#/patients/{{ model.currentPatient.patientId }}/schedule/complex">Complex</a>
            </li>

当我点击Complex时，HomeController会因某种原因被触发。

window.map.controller('HomeController', ['$scope', '$location', 'cache',
    function($scope, $location, cache) {
console.trace();

trace被触发：

[Log] console.trace()
    (anonymous function) (app.src.js, line 6110)
    invoke (vendor.src.js, line 29750)
    instantiate (vendor.src.js, line 29758)
    (anonymous function) (vendor.src.js, line 34048)
    link (vendor.src.js, line 52831)
    invokeLinkFn (vendor.src.js, line 33805)
    nodeLinkFn (vendor.src.js, line 33315)
    compositeLinkFn (vendor.src.js, line 32664)
    publicLinkFn (vendor.src.js, line 32543)
    boundTranscludeFn (vendor.src.js, line 32682)
    controllersBoundTransclude (vendor.src.js, line 33342)
    update (vendor.src.js, line 52789)
    $broadcast (vendor.src.js, line 40332)
    (anonymous function) (vendor.src.js, line 52472)
    processQueue (vendor.src.js, line 38795)
    (anonymous function) (vendor.src.js, line 38811)
    $eval (vendor.src.js, line 40013)
    $digest (vendor.src.js, line 39829)
    $apply (vendor.src.js, line 40118)
    done (vendor.src.js, line 35245)
    completeRequest (vendor.src.js, line 35435)
    requestLoaded (vendor.src.js, line 35376)

为什么会这样？

Answer 1

在您的HTML中，AngularJS不处理点击，但是当AngularJS检测到哈希更改时，稍后会选择。要解决此问题，您应使用ng-href代替href，并省略#/部分。 AngularJS将重写您的链接以#/开头。

   <li class="anchor" data-ng-class="{'current-pg':model.schedulePage==='daily-schedule'}">
        <a ng-href="patients/{{ model.currentPatient.patientId }}/schedule/daily">Daily</a>
    </li>
    <li data-ng-class="{'current-pg':model.schedulePage==='complex-schedule'}">
        <a ng-href="patients/{{ model.currentPatient.patientId }}/schedule/complex">Complex</a>
    </li>

为什么路由会在$ routeProvider的早期触发？

1 个答案: