10

我正在尝试使用 ui-router 来触发特定状态的模式，而不是更改整个视图。为此，我实现了FAQ 中给出的稍微调整的形式，因为我使用的是angular-foundation而不是 bootstrap。当我触发状态时，会显示模式，但是即使在我的状态中没有指定视图，它也会清除现有视图：

.state('selectModal',
  onEnter: ($modal, $state, $sessionStorage) ->
    $modal.open(
      templateUrl: 'views/select_modal.html'
      windowClass: 'tiny'
      controller: 'SelectCtrl'
      resolve:
        options: (Restangular) -> Restangular.all('options').getList()
    )
    .result.then (result) ->
      $sessionStorage.selected = result
      $state.go 'resource', id: result.id
)

我应该为此状态配置视图/父级，例如<div ui-view='modal'></div>还是parent:'main'（我希望它可以从任何状态访问而不在切换时更改该状态）？

4

2 回答 2

1

使用“.”指定它具有父状态。命名约定。（将“parentState”替换为实际父级的名称）：.state('parentState.selectModal',...

于 2014-09-23T20:36:11.497 回答
0

您是否考虑过将模态代码放入服务中并在每个使用模态的控制器中调用该服务？

angular.module('app').service('modal', function(){

    function open(){
        $modal.open(
            templateUrl: 'views/select_modal.html',
            windowClass: 'tiny',
            controller: 'SelectCtrl',
            resolve: {
                options: function(Restangular) { Restangular.all('options').getList() }
            }
        ) // .result... if it's generic, otherwise put it in the controller
    }
});

angular.module('myapp').controller('main', function($scope, modal){

    modal.open().result.then(function(result) {
        $sessionStorage.selected = result;
        $state.go('resource', id: result.id);
    });

}
于 2015-04-21T22:50:39.650 回答