angularjs – 在创建$ionModal时使用“this”作为范围

发布时间：2020-12-17 07:45:05 所属栏目：安全来源：网络整理

导读：当我尝试指定我的范围而不是$scope时,我似乎在创建一个$ionModal时遇到问题. 由于我通过实例名称绑定我的控制器中的所有内容,所以我没有在控制器内部使用$scope. 所以,我启动了在Ionic Framework doc这里指示的模式并用此切换$范围 $ionicModal.fromTemplat

当我尝试指定我的范围而不是$scope时,我似乎在创建一个$ionModal时遇到问题.

由于我通过实例名称绑定我的控制器中的所有内容,所以我没有在控制器内部使用$scope.

所以,我启动了在Ionic Framework doc这里指示的模式
并用此切换$范围

$ionicModal.fromTemplateUrl('my-modal.html',{
    scope: this,animation: 'slide-in-up'
  }).then(function(modal) {
    this.modal = modal;
  });

当应用程序运行时,我收到以下错误：

undefined is not a function

并在ion.bundle.js中引用以下代码：

var createModal = function(templateString,options) {
    // Create a new scope for the modal
    var scope = options.scope && options.scope.$new() || $rootScope.$new(true);

我甚至尝试分配另一个变量来表示它,并以这种方式运行,但是同样的错误占优势！

如果我没有在我的控制器中使用$scope,那么在保持这种使用方式的同时加载模态是最好的方法？这是不可能还是我错过了什么？

编辑-
根据要求,添加更多信息到原始,

模板：

<div id="wrapper" ng-controller="MainCtrl as ctrl">
<button ng-click="ctrl.demo()">Demo Button</button>
</div>

控制器：

angular.module('MyDemo',['ionic'])
.controller('MainCtrl',function ($ionicModal) {
var _this = this;
this.demo = function () {
//do demo related stuff here
}

$ionicModal.fromTemplateUrl('my-modal.html',{
        scope: _this,animation: 'slide-in-up'
      }).then(function(modal) {
        _this.modal = modal;
      });
});

所以,基本上,我使用这里找到的第一个声明风格：
https://docs.angularjs.org/api/ng/directive/ngController

编辑：将其更改为$ionModal内的_this

根据要求,这里是一个具有以上代码的空格：
http://plnkr.co/edit/4GbulCDgoj4iZtmAg6v3?p=info

由于AngularJs当前使用“controller as”语法设置了控制器的方式,所以您只能具有您在控制器功能中定义的任何功能和属性.为了访问AngularJ提供的 $new()功能来创建子范围,您需要提供一个AngularJs $scope对象,即使使用“controller as”语法,仍然可以将其注入到构造函数中.

angular.module('MyDemo',function ($scope,$ionicModal) {
  var _this = this;
  this.demo = function () {
    //do demo related stuff here
  }

  $ionicModal.fromTemplateUrl('my-modal.html',{
    scope: $scope,animation: 'slide-in-up'
  }).then(function(modal) {
    _this.modal = modal;
  });
});

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!