Question

忍受我 - 我是一个AngularJS新手。

我有一个表单，我想在我的应用程序的任何地方提供，我正在试图找出如何编码。我目前的尝试是将模态放入服务中，如下所示：

.service('NewObjectService', function() {
  var svc = this;

  svc.showModal = function() {
    $ionicModal.fromTemplateUrl('template.html', {
      scope: null, // what should I do here?
      animation: 'slide-in-up'
    }).then(function(modal) {
      svc.modal = modal;
      modal.show();
    });
  }
})

.controller('NewObjectController', function() {
  $scope.$on('$ionicView.enter', function() {
    console.log('NewObjectController');
    // setup new object
  })
})

然后，在我的应用中的任何地方，我都可以拨打NewObjectService.showModal()并弹出模式。那部分正在发挥作用。

我遇到的麻烦是我无法触发我的控制器，因此初始化永远不会被调用，我的新对象为空。

似乎我应该从NewObjectController内部调用模态到设置范围，但我尝试了，我无法弄清楚如何从其他控制器中调用该控制器 - 因此服务。< / p>

我知道我只是做了一些根本错误的事情，但我不确定它是什么。有什么帮助吗？

更新：我也尝试使用根范围广播从另一个控制器调用一个控制器：

.controller('MainCtrl', function() {
  this.showModal = function() {
    $rootScope.$broadcast('new_object:show_modal');
  }
})

.controller('NewObjectCtrl', function() {
  $rootScope.$on('new_object:show_modal', function() {
    // show modal
  })
})

我遇到的问题是MainCtrl运行时没有调用NewObjectCtrl，因此它不会捕获广播事件。

Answer 1

当您声明服务时，您需要在Angular声明中返回自己，即var svc = {};返回svc;在注入服务并传入范围后，从任何控制器调用svc.showModal。使用$ rootScope。$ on（receiver）和$ rootScope。$ emit（from）

从另一个控制器调用控制器

.service('NewObjectService', function($ionicModal) {
  var svc = {};

  svc.showModal = function(_scope) {
    $ionicModal.fromTemplateUrl('template.html', {
      scope: _scope, // passing in scope from controller
      animation: 'slide-in-up'
    }).then(function(modal) {
      svc.modal = modal;
      modal.show();
    });
  }

  return svc;

})

.controller('NewObjectController', function($scope, $rootScope, NewObjectService) {
  // fires off when $rootScope.$emit('ShowModal') is called anywhere
  $rootScope.$on('ShowModal', function(data) {
    NewObjectService.showModal(data._scope);
  });
})

.controller('OtherController', function($scope, $rootScope) {
  $scope.contactOtherController = function() {
    // contact the other controller from this controller
    $rootScope.$emit("ShowModal", {scope: $scope});
  }
})

Ionic / AngularJS - 带控制器的全局模态

1 个答案: