CODEWITHSUNDEEP
dartangular-dart
Moritz
Moritz

Reputation: 10352

Angulardart should not make links reload

In angularjs you can prohibit to reload a page when using.

<a href="" ng-click="..">text</a>

In angulardart the link is actually navigating to the href. Is that intended?

Goog examples of the angularjs behavior: http://docs.angularjs.org/api/ng.directive:ngHref

<a id="link-1" href ng-click="value = 1">link 1</a> (link, don't reload)

Upvotes: 4

Views: 681

Answers (2)

Scotty Waggoner
Scotty Waggoner

Reputation: 3380

Another solution is to enable NgRoutingUsePushState which seems to not interfere with anchor links or ng-click at all. You just have to remove or comment out the following line in your RoutingModule:

//bind(NgRoutingUsePushState, toValue: new NgRoutingUsePushState.value(false));

To use push state you also have to have your webserver rewrite urls to index.html. It makes running the app on a local dev server a little more complex but I decided to go for it since I want that functionality eventually and because of this bug. An example nginx config is:

location / {
    # try to serve file directly, fallback to rewrite
    try_files $uri @rewriteapp;
}

location @rewriteapp {
    # rewrite all to index.html
    rewrite ^(.+)$ /index.html last;
}

Note: Tested with Angular 0.13.0

Upvotes: 1

G&#252;nter Z&#246;chbauer
G&#252;nter Z&#246;chbauer

Reputation: 657691

EDIT

<a href="#" ng-click="ctrl.clickHandler($event)">text</a>

. 

import 'dart:html';

// ...

void clickHandler(MouseEvent event) {
  event.preventDefault(); // suppress default click action
  event.stopPropagation();  // 
  //event.stopImmediatePropagation(); // optional

  // do something else
}

old answer

I haven't used it myself yet but AngularDart has the NgHref directive

https://github.com/angular/angular.dart/blob/master/lib/directive/ng_src_boolean.dart#L60

Upvotes: 4

Related Questions