ICode9

精准搜索请尝试: 精确搜索
首页 > 编程语言> 文章详细

javascript – 如何在Controller As语法中使用带有范围的Ionic Popup?

2019-06-09 09:21:02  阅读:238  来源: 互联网

标签:javascript angularjs angularjs-controller ionic


我有一个使用Controller作为语法的Angular控制器设置,我需要从一个方法创建一个带有绑定数据字段的Ionic Popup.我无法弄清楚的是如何为数据绑定设置弹出窗口的范围.我找到了this的例子但是对我来说使用这个和$scope似乎很麻烦.有没有更好的方法来做到这一点,还是我应该回到$scope方法?

我的控制器看起来像这样(标有问题):

.controller('AccountCtrl', function ($ionicPopup) {
    // Properties ===========
    this.resetData = {};

    // Methods ==============
    this.forgotPassword = function () {
        var myPopup = $ionicPopup.show({
            template: '<input type="text" ng-model="<What goes here?>.resetData.resetEmail">',
            title: 'Please enter your e-mail address',
            scope: <What goes here?>
            buttons: [
                {
                    text: 'Submit',
                    onTap: function (e) {
                        console.log("Password reset:" + <What goes here?>.resetData);
                    }
                },
                { text: 'Cancel' }
            ]
        });
    }
})

我的模板看起来像:

<ion-view view-title="Sign In">
    <ion-content has-bouncing="false" ng-controller="AccountCtrl as account">
        <a href="#" ng-click="account.forgotPassword()">Forgot your password?</a>
    </ion-content>
</ion-view>

任何想法将不胜感激.
谢谢,
贾森

解决方法:

在该示例中,他们注入$scope,以便他们可以将其指定为弹出窗口选项中的范围属性.

也许如果我弄清楚“控制器为”语法实际上是做什么的,你就不会觉得它太乱了:)

当您执行ng-controller =“myController as ctrl”时,您所做的就是在该控制器的$scope上声明一个名为ctrl的变量,并将该值设置为该控制器的值.将“myController作为ctrl”实际上与没有像这样的“as”快捷方式完全相同:

<!-- markup -->
<div ng-controller="myController"></div>

然后在你的控制器中:

// controller
app.controller('myController', function ($scope) {
  $scope.ctrl = this;
});

你将“myController作为ctrl”的唯一区别是$scope.ctrl =这只是在幕后发生的.

查看this demo以证明它们是同一个.

他们在你联系的演示中所做的事情在我看来完全没问题;)

这是我写的关于“控制器为”的博客文章,如果你有兴趣:http://codetunnel.io/angularjs-controller-as-or-scope/

标签:javascript,angularjs,angularjs-controller,ionic
来源: https://codeday.me/bug/20190609/1204374.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有