如何让模态窗口打开动态内容并更改网址？

Question

我想让模态窗口打开不同的路由，就像这个网站http://architizer.com/projects/rauchkuchlhaus-auf-der-seewiese-am-schliersee-1/

一样

Answer 1

流程是：

1. 为模态窗口创建路线状态
2. 将模态打开逻辑放在onEnter属性中（当路由更改为当前状态时将运行）。
3. 最后所有项目（应该打开新模态）都应该引用所需参数ui-sref="home({foo: 'fooVal1'})"来更改路线。

您可以在ui-router modal

的常见问题中找到答案

$stateProvider.state("items.add", {
url: "/add",
onEnter: ['$stateParams', '$state', '$modal', '$resource', function($stateParams, $state, $modal, $resource) {
    $modal.open({
        templateUrl: "items/add",
        resolve: {
          item: function() { new Item(123).get(); }
        },
        controller: ['$scope', 'item', function($scope, item) {
          $scope.dismiss = function() {
            $scope.$dismiss();
          };

          $scope.save = function() {
            item.update().then(function() {
              $scope.$close(true);
            });
          };
        }]
    }).result.finally(function() {
        $state.go('^');
    });
}]
});