Skip to content

Commit

Permalink
feat(uiSref): extend syntax for ui-sref
Browse files Browse the repository at this point in the history
add possibility to pass params to current state without entering state name
  • Loading branch information
timfjord committed Mar 18, 2014
1 parent 4d74d98 commit 71cad3d
Show file tree
Hide file tree
Showing 2 changed files with 32 additions and 6 deletions.
14 changes: 8 additions & 6 deletions src/stateDirectives.js
Original file line number Diff line number Diff line change
@@ -1,5 +1,7 @@
function parseStateRef(ref) {
var parsed = ref.replace(/\n/g, " ").match(/^([^(]+?)\s*(\((.*)\))?$/);
function parseStateRef(ref, current) {
var preparsed = ref.match(/^\s*({[^}]*})\s*$/), parsed;
if (preparsed) ref = current + '(' + preparsed[1] + ')';
parsed = ref.replace(/\n/g, " ").match(/^([^(]+?)\s*(\((.*)\))?$/);
if (!parsed || parsed.length !== 4) throw new Error("Invalid state ref '" + ref + "'");
return { state: parsed[1], paramExpr: parsed[3] || null };
}
Expand Down Expand Up @@ -43,7 +45,7 @@ function stateContext(el) {
* Here's an example of how you'd use ui-sref and how it would compile. If you have the
* following template:
* <pre>
* <a ui-sref="home">Home</a> | <a ui-sref="about">About</a>
* <a ui-sref="home">Home</a> | <a ui-sref="about">About</a> | <a ui-sref="{page: 2}">Next page</a>
*
* <ul>
* <li ng-repeat="contact in contacts">
Expand All @@ -52,9 +54,9 @@ function stateContext(el) {
* </ul>
* </pre>
*
* Then the compiled html would be (assuming Html5Mode is off):
* Then the compiled html would be (assuming Html5Mode is off and current state is contacts):
* <pre>
* <a href="#/home" ui-sref="home">Home</a> | <a href="#/about" ui-sref="about">About</a>
* <a href="#/home" ui-sref="home">Home</a> | <a href="#/about" ui-sref="about">About</a> | <a href="#/contacts?page=2" ui-sref="{page: 2}">Next page</a>
*
* <ul>
* <li ng-repeat="contact in contacts">
Expand Down Expand Up @@ -82,7 +84,7 @@ function $StateRefDirective($state, $timeout) {
restrict: 'A',
require: '?^uiSrefActive',
link: function(scope, element, attrs, uiSrefActive) {
var ref = parseStateRef(attrs.uiSref);
var ref = parseStateRef(attrs.uiSref, $state.current.name);
var params = null, url = null, base = stateContext(element) || $state.$current;
var isForm = element[0].nodeName === "FORM";
var attr = isForm ? "action" : "href", nav = true;
Expand Down
24 changes: 24 additions & 0 deletions test/stateDirectivesSpec.js
Original file line number Diff line number Diff line change
Expand Up @@ -184,6 +184,30 @@ describe('uiStateRef', function() {
expect($state.current.name).toEqual('');
expect($stateParams).toEqual({ id: "5" });
}));

it('should allow passing params to current state', inject(function($compile, $rootScope, $state) {
$state.current.name = 'contacts.item.detail';

el = angular.element("<a ui-sref=\"{id: $index}\">Details</a>");
$rootScope.$index = 3;
$rootScope.$apply();

$compile(el)($rootScope);
$rootScope.$digest();
expect(el.attr('href')).toBe('#/contacts/3');
}));

it('should allow multi-line attribute values when passing params to current state', inject(function($compile, $rootScope, $state) {
$state.current.name = 'contacts.item.detail';

el = angular.element("<a ui-sref=\"{\n\tid: $index\n}\">Details</a>");
$rootScope.$index = 3;
$rootScope.$apply();

$compile(el)($rootScope);
$rootScope.$digest();
expect(el.attr('href')).toBe('#/contacts/3');
}));
});

describe('forms', function() {
Expand Down

0 comments on commit 71cad3d

Please sign in to comment.