Question

无法使用mandrill api发送电子邮件。我已将控制器添加到我的标记中，但是当单击发送按钮时没有任何反应。我跟随离子论坛的一个例子，并相信我错过了一些东西。所以要具体说明我需要的是：我想知道如何从我的离子应用程序发送预先填写提交的表单数据的电子邮件。显然，对于测试，我没有添加ng-model来存储提交的数据。以下是我的代码，请看一下。感谢

shop.html查看代码

<ion-view view-title="Shop" ng-controller="OrderFormController">
  <ion-content>

    <div class="card">
        <ion-item ng-repeat="service in services">
            {{service.name}}
                <button class="button button-outline button-small button-stable" ng-click="toggleActive(service)" ng-class="{active:service.active}">
                    {{service.price | currency}}
                </button>
        </ion-item>
    </div>

    <div class="card">
        <ion-item ng-repeat="service in services | filter:true">
            {{service.name}}<br>{{service.price | currency}}
        </ion-item>

        <ion-item>
            Total: {{total() | currency}}
            <button href="#" class="button button-outline button-small button-stable">
                    Checkout
            </button>
        </ion-item>
    </div>

    <form novalidate> 
        <div class="list list-inset">
            <label class="item item-input">
                <input type="text" placeholder="email" name="email" ng-model="email">
            </label>
            <label class="item item-input">
                <input type="text" placeholder="phone" name="phone" ng-model="phone">
            </label>-->
            <label class="item item-input">
                <input type="text" placeholder="address" name="address" ng-model="address">
            </label>
        </div>
    </form>

    <button class="button button-full button-stable" ng-controller="sentMailCntrl" ng-click="sendMail({
        toEmail: 'email@gmail.com',
        subject: 'New Order',
        mailBody: {{totalItems()}}
        })">
        Send Order
    </button>

  </ion-content>
</ion-view>

OrderFormController

  myApp.controller('OrderFormController', function($scope) {

$scope.services = [
    {
        name: 'Espresso',
        price: 27,
        active:false
    },{
        name: 'Americano',
        price: 36,
        active:false
    },{
        name: 'Macchiato',
        price: 57,
        active:false
    },{
        name: 'Cappuccino',
        price: 42,
        active:false
    },{
        name: 'Mocha',
        price: 55,
        active:false
    },{
        name: 'Latte',
        price: 39,
        active:false
    },{
        name: 'Chai Latte',
        price: 50,
        active:false
    }
];

$scope.toggleActive = function(s){
    s.active = !s.active;
};

$scope.total = function(){

    var total = 0;

    angular.forEach($scope.services, function(s){
        if (s.active){
            total+= s.price;
        }
    });

    return total;
};

$scope.totalItems = function(){

    var totalItems = "";

    angular.forEach($scope.services, function(s){
        if (s.active){
            totalItems+= s.name+" $"+s.price+".00 ";
        }
    });

    return totalItems;
  };
});

sentMailCntrl

var myApp = angular.module('ionicApp', ['ionic']);

myApp.controller('sentMailCntrl',function($scope, $http){
  $scope.sendMail = function(a){
    console.log(a.toEmail);
    var mailJSON ={
        "key": " ",
        "message": {
          "html": ""+a.mailBody,
          "text": ""+a.mailBody,
          "subject": ""+a.subject,
          "from_email": "noreply@fooddelivery.com",
          "from_name": "New Order",
          "to": [
            {
              "email": ""+a.toEmail,
              "name": "New Order",
              "type": "to"
            }
          ],
          "important": false,
          "track_opens": null,
          "track_clicks": null,
          "auto_text": null,
          "auto_html": null,
          "inline_css": null,
          "url_strip_qs": null,
          "preserve_recipients": null,
          "view_content_link": null,
          "tracking_domain": null,
          "signing_domain": null,
          "return_path_domain": null
        },
        "async": false,
        "ip_pool": "Main Pool"
    };
    var apiURL = "https://mandrillapp.com/api/1.0/messages/send.json";
    $http.post(apiURL, mailJSON).
      success(function(data, status, headers, config) {
        alert('successful email send.');
        $scope.form={};
        console.log('successful email send.');
        console.log('status: ' + status);
        console.log('data: ' + data);
        console.log('headers: ' + headers);
        console.log('config: ' + config);
      }).error(function(data, status, headers, config) {
        console.log('error sending email.');
        console.log('status: ' + status);
      });
  }
})

这是点击发送电子邮件按钮时的控制台日志

TypeError: Cannot read property 'toEmail' of undefined
at l.$scope.sendMail (app.js:6)
at ib.functionCall (ionic.bundle.min.js:229)
at ionic.bundle.min.js:386
at l.$get.l.$eval (ionic.bundle.min.js:156)
at l.$get.l.$apply (ionic.bundle.min.js:157)
at HTMLButtonElement.<anonymous> (ionic.bundle.min.js:386)
at HTMLButtonElement.c (ionic.bundle.min.js:63)
at n (ionic.bundle.min.js:22)
at t (ionic.bundle.min.js:22)
at HTMLDocument.r (ionic.bundle.min.js:22)

Answer 1

您没有为sendMail函数提供参数。

sendMail函数要求您发送一个如下所示的对象：

{
  toEmail: 'emailaddress',
  subject: 'subject',
  mailBody: 'body of the email'
}

在您的HTML中拨打您的电话：

 <button class="button button-outline button-stable" ng-click="sendMail({
      toEmail: 'emailaddress',
      subject: 'subject',
      mailBody: 'body of the email'
    })">

将toEmail属性设置为有效的电子邮件地址。如果可以，那么您可以构建您的应用程序以使用在表单中输入的电子邮件地址，或者您计划获取电子邮件地址。您还需要适当地设置subject和mailBody属性。

发送电子邮件与mandrill从angular ionic app

1 个答案: