最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - AngularJS routing is not working: no events on link clicks, no $routeParams - Stack Overflow

programmeradmin1浏览0评论

Somehow my app stopped working during development and I really cannot get what's wrong with it.

I've removed everything, the only code remaining is:

function handlerControl($scope, $routeParams, $location){
    $scope.route = $routeParams;
}

var app = angular.module('Hello', []).config(
    function($routeProvider){
        $routeProvider.when('/:a/:b', {controller: handlerControl});
    }
);

and html is

<body ng-app="Hello">

<div ng-controller="handlerControl">
    {{route}}
</div>

</body>

omitting head part with including everything.

When I go to

http://helloday/#/a/b/

I'm getting an empty hash while expecting to get {a: 'a', b: 'b'}

What I'm doing wrong?

Bit modified(to make it work) jsFiddle: ://jsfiddle/wWDj2/

Somehow my app stopped working during development and I really cannot get what's wrong with it.

I've removed everything, the only code remaining is:

function handlerControl($scope, $routeParams, $location){
    $scope.route = $routeParams;
}

var app = angular.module('Hello', []).config(
    function($routeProvider){
        $routeProvider.when('/:a/:b', {controller: handlerControl});
    }
);

and html is

<body ng-app="Hello">

<div ng-controller="handlerControl">
    {{route}}
</div>

</body>

omitting head part with including everything.

When I go to

http://helloday/#/a/b/

I'm getting an empty hash while expecting to get {a: 'a', b: 'b'}

What I'm doing wrong?

Bit modified(to make it work) jsFiddle: http://jsfiddle/wWDj2/http://jsfiddle/wWDj2/

Share Improve this question edited Jan 25, 2013 at 15:19 Jabher asked Jan 25, 2013 at 14:53 JabherJabher 3285 silver badges12 bronze badges 0
Add a ment  | 

1 Answer 1

Reset to default 6

Routing requires you use ngView, and that you specify either a template or a templateUrl:

App code.

var app = angular.module('myApp', []);

app.config(function($routeProvider) {
   $routeProvider.when('/foo/:id', {
        controller: 'FooCtrl',
        template: '<h1>Foo {{id}}</h1>'
   })
   .when('/bar/:test', {
        controller: 'BarCtrl',
        templateUrl: 'bartemplate.html'
   })
   .otherwise({ 
        controller: 'DefaultCtrl',
        template: '<h1>This is the default</h1>'
   });
});

app.controller('FooCtrl', function($scope, $routeParams) {
   $scope.id = $routeParams.id;
});

app.controller('BarCtrl', function($scope, $routeParams) {
   $scope.test = $routeParams.test;
});

app.controller('DefaultCtrl', function($scope){});

Your main page's markup:

<div ng-app="myApp">
   <a href="#/foo/123">Foo 123</a>
   <a href="#/bar/blah">Bar Blah</a>
   <a href="#">Default route</a>
   <hr/>
   <div ng-view>
       <!-- your processed view will show up here -->
   </div>
</div>

与本文相关的文章

发布评论

评论列表(0)

  1. 暂无评论