w3hello.com logo
Home PHP C# C++ Android Java Javascript Python IOS SQL HTML videos Categories
angular-ui-router dynamic menu: TypeError: Cannot call method 'match' of undefined while rendering menu

So ui-router doesn't support interpolation in ui-sref, believe me I wish they would. Here is how I solved this.

In your controller:

app.controller("MenuCtrl", ['$scope', '$state', function($scope,
$state) {
    $scope.$state = $state;
}]);

In your view use an ng-href to evaluate $state object that we've now added to the $scope:

<div ng-controller="MenuCtrl">
    <ul>
        <li ng-repeat="item in menu">
            <a ng-href={{ $state.href('cf.' + item)
}}>{{item}}</a>
        </li>
    </ul>
</div>

You can also you this technique for wildcard params:

ng-href="{{ $state.href('cf.items.item', {'item' : item} ) }}"

Assuming you've set up your ui-router routes properly for this.





© Copyright 2018 w3hello.com Publishing Limited. All rights reserved.