scope.modal.show()不是函数？

Question

我尝试打开一个模态视图.为此,我使用以下内容:

crop: function(options) {
  options = this.initOptions(options);

  var scope = $rootScope.$new(true);

  ionic.extend(scope, options);

  scope.modal = $ionicModal.fromTemplate(template, {
    scope: scope
  });

  // Show modal and initialize cropper.
  return scope.modal.show().then(function() {
    return (new jrCropController(scope)).promise.promise;
  });
},

这工作正常.但现在我不想在javascript中定义我的模板.我想在一个额外的html文件中定义我的模板,所以我做了.

所以我不得不取代这个:

$ionicModal.fromTemplate(template,

有了这个:

$ionicModal.fromTemplateUrl(url,

但现在我收到以下错误:

ionic.bundle.js:20306 TypeError: scope.modal.show is not a function
at Object.crop (jr-crop.js:287)
at Scope.$scope.crop (polaroids_edit.js:51)
at $parseFunctionCall (ionic.bundle.js:21044)
at ionic.bundle.js:53458
at Scope.$eval (ionic.bundle.js:23100)
at Scope.$apply (ionic.bundle.js:23199)
at HTMLButtonElement.<anonymous> (ionic.bundle.js:53457)
at HTMLButtonElement.eventHandler (ionic.bundle.js:11713)
at triggerMouseEvent (ionic.bundle.js:2863)
at tapClick (ionic.bundle.js:2852)

当我使用模板网址而不是模板时,为什么会出现此错误？对我来说没有意义,因为在两种情况下它都是相同的方法.

Answer 1

我认为你错过了fromTemplate()返回模式对象同时fromTemplateUrl()返回一个promise 的事实,因为你是异步加载模板的.

因此,这很好

scope.modal = $ionicModal.fromTemplate(template, {
    scope: scope
});

而这将无法正常工作

scope.modal = $ionicModal.fromTemplateUrl(url, {
    scope: scope
});

因为scope.modal将是一个承诺对象.

您将不得不等待承诺解决,然后分配模态,如

$ionicModal.fromTemplateUrl(url, {
    scope: $scope,
}).then(function(modal) {
    $scope.modal = modal;
});

有关参考,请查看$ ionicModal:fromTemplate与fromTemplateUrl函数