javascript 离子模式未打开(类型错误:无法读取未定义的属性“显示”)?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/28328024/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-28 08:46:53  来源:igfitidea点击:

Ionic Modal not opening (TypeError: Cannot read property 'show' of undefined)?

javascriptandroidangularjsionic-framework

提问by Bruno Duarte Brito

I am making an ionic + angularJs app, for Android to be specific. I don't know why, but in my so named homeController, whenever I tried to call a function to show me a $ionicModal, it gives me an error...

我正在制作一个 ionic + angularJs 应用程序,具体适用于 Android。我不知道为什么,但是在我的名字中homeController,每当我尝试调用一个函数来显示 a 时$ionicModal,它都会给我一个错误......

TypeError: Cannot read property 'show' of undefined at Scope.$scope.openModal (homeModule.js:18) at new (homeModule.js:59) at Object.invoke (ionic.bundle.js:11994) at $get.extend.instance (ionic.bundle.js:16247) at ionic.bundle.js:15502 at forEach (ionic.bundle.js:8155) at nodeLinkFn (ionic.bundle.js:15501) at compositeLinkFn (ionic.bundle.js:14887) at publicLinkFn (ionic.bundle.js:14766) at IonicModule.controller.self.appendViewElement (ionic.bundle.js:47324)

类型错误:无法在 $get 处的 Object.invoke (ionic.bundle.js:11994) 处的 new (homeModule.js:59) 处读取 Scope.$scope.openModal (homeModule.js:18) 处未定义的属性“show”。扩展实例 (ionic.bundle.js:16247) at ionic.bundle.js:15502 at forEach (ionic.bundle.js:8155) at nodeLinkFn (ionic.bundle.js:15501) at CompositeLinkFn (ionic.bundle.js) :14887) at publicLinkFn (ionic.bundle.js:14766) at IonicModule.controller.self.appendViewElement (ionic.bundle.js:47324)

My controller looks like this (the start of it):

我的控制器看起来像这样(它的开始):

app.controller('homeController', function($scope, $ionicPopup, $state, $ionicLoading, $rootScope, $ionicModal, mapFactory){
    // Load the modal from the given template URL
    $ionicModal.fromTemplateUrl('templates/loginModal.html', function($ionicModal) {
      $scope.modal = $ionicModal;
      console.log($scope.modal);
    }, {
      scope: $scope,
      animation: 'slide-in-up',
      backdropClickToClose: false,
      hardwareBackButtonClose: false,
      focusFirstInput: true
    });
    $scope.openModal = function() {
        $scope.modal.show();
    };
    $scope.closeModal = function() {
        $scope.modal.hide();
    };

I have tried already many different ways to make the modal open, the funny thing is, whenever I go to a new $state, and go back, it opens... But not when I refresh the page. Also, I did a console.log($scope.modal)to see if my variable was being set, and the result was:

我已经尝试了很多不同的方法来打开模态,有趣的是,每当我进入一个新的 $state 并返回时,它会打开......但不是当我刷新页面时。另外,我做了一个console.log($scope.modal)看看我的变量是否被设置,结果是:

ionic.Utils.inherit.child {focusFirstInput: true, unfocusOnHide: true, focusFirstDelay: 600, backdropClickToClose: false, hardwareBackButtonClose: false…}$el: JQLite[1]animation: "slide-in-up"backdropClickToClose: falseel: div.modal-backdropfocusFirstDelay: 600focusFirstInput: truehardwareBackButtonClose: falsemodalEl: ion-modal-view.modalscope: ChildScopeunfocusOnHide: trueviewType: "modal"__proto__: ionic.Utils.inherit.Surrogate 

Can anyone please help me on this one? Thanks in advance.

任何人都可以帮我解决这个问题吗?提前致谢。

采纳答案by Brad Barber

The error means $scope.modalwas not created - you call to fromTemplateUrlisn't right. The second parameter is the modal options and you're passing a callback.

错误意味着$scope.modal未创建 - 您调用的fromTemplateUrl是不对的。第二个参数是模式选项,您正在传递回调。

The documentation provides a good example.

该文档提供了一个很好的示例

In your case, the call to fromTemplateUrlshould look more like this:

在您的情况下,对的调用fromTemplateUrl应该更像这样:

$ionicModal.fromTemplateUrl('templates/loginModal.html', {
  scope: $scope,
  animation: 'slide-in-up',
  backdropClickToClose: false,
  hardwareBackButtonClose: false,
  focusFirstInput: true
}).then(function(modal) {
  $scope.modal = modal;
  console.log($scope.modal);
});

回答by Bruno Duarte Brito

I think i found the fix. I was trying to open the modal from inside a 'if' statement, as soon as i took it off from the 'if', it worked perfectly fine. Anyways, thank you Brad.

我想我找到了解决办法。我试图从“if”语句中打开模态,一旦我将它从“if”中取出,它就工作得很好。不管怎样,谢谢布拉德。