angularjs - $routeProvider - modal of a single page with different URL -
i have list of items showed in page. idea click on item, , open modal showing information of selected item, , in background list remains. when modal opens, url should change. idea have specific url every item, when access url, should see modal, item info , in background main page.
i'm using $routeprovider routing.
example:
i have similar this
.config(function ($routeprovider) { $routeprovider .when('/', { templateurl: 'views/main.html', controller: 'mainctrl' }) .when('/meals', { templateurl: 'views/meals/meals.html', controller: 'mealsctrl' }) .when('/meal/:mealid', { templateurl: 'views/meals/meal-profile.html', controller: 'mealctrl' })
the /meal/:mealid should shown in modal, , url should change when modal opened.
i've searched lot, couldn't find suitable answer this.
thanks help!!
you can specify states want show modal , when handled, return state want to. example:-
app.config(function ($stateprovider) { $stateprovider.state('tasks', { url: '/tasks', templateurl: 'tasks.html', controller: 'tasksctrl' url: "/tasks/:id", onenter: function($stateparams, $state, $modal) { $modal.open({ templateurl: "show.html", resolve: {}, controller: function($scope, $state) { $scope.ok = function () { $scope.$close(); }; $scope.dismiss = function () { $scope.$dismiss(); }; } }).result.then(function (result) { // $scope.$close }, function (result) { // $scope.$dismiss }).finally(function () { // return $state.transitionto("tasks"); }); } }); });
here plunker code : code edit answer routeprovider also.
Comments
Post a Comment