在mailto中使用ng-repeat? (通过JSON属性向多个收件人发送邮件)

时间:2016-07-13 20:21:20

标签: javascript angularjs mailto

我目前正在处理使用angular,PHP和mySQL来跟踪用户条目的表单。我已经在这支笔http://codepen.io/StuffieStephie/full/BzmxXd/中将SQL转换为常规JSON,这样你就可以看到我正在尝试做什么。

当我点击Email All {{selected.field}} Volunteers按钮时,我想要一个逗号分隔的所有电子邮件列表,与过滤器匹配。

我可以使用

获取列表
<b ng-repeat="d in names | filter:filters">{{d.email}}{{$last ? '' : ', '}}</b>

但我如何通过电子邮件发送给这些人?我觉得在这里使用ng-href是错误的。正确方向的一点将不胜感激!

编辑:好的,我有点想通过将邮件链接设置为列表模式的文本内容来做到这一点。但这看起来真的很糟糕

<a ng-href="mailto:{{emails}}" target="_blank" class="waves-effect waves-light btn margin-bottom-1em"><i class="material-icons left">email</i>Email All {{selected.field}} Volunteers ({{(names | filter:filters).length}})</a>

  $scope.hasChanged = function() {
       $scope.filters = $scope.selected.field;
       $scope.emails = $( "b.theEmails" ).text();
    return $scope.emails;
  }

此外,我必须更改下拉过滤器以运行hasChanged()函数,以便分配$scope.emails的值。 (我试图在函数之外给它一个值,但它似乎不起作用。有什么帮助吗?

1 个答案:

答案 0 :(得分:1)

知道了! Angular是如此的花哨,以至于我有时会忘记vanilla JS:P这可能更有效但它有效!看哪! http://codepen.io/StuffieStephie/full/QEaGPY/

// Lil function to check if empty
function isEmpty(obj) {
  if (obj) {
    for (var prop in obj) {
      if (obj.hasOwnProperty(prop)) {
        return false;
      }
    }
  }
  return true;
}


$scope.getEmails = function(){
  var statusFilter = $scope.filters;
  var res = [];
  for (var i=0;i<$scope.names.length;i++) {
       var thisVolunteer = $scope.names[i];
       var email = thisVolunteer["email"];
     if (isEmpty(statusFilter) == false){ //If there's a filter, status must match
         if ( thisVolunteer.status == statusFilter) {
             res.push(email); 
            } //END IF Matching Status
         }//END IF filter  

    // OTHERWISE (no filter) Add/push all emails into res array
    else {res.push(email); } //END ELSE add all
    } //END FOR 
  $scope.list = res.join(", "); //Join the emails as a comma separated list
}; //END GetEmails();

以HTML格式初始化

<a ng-init="getEmails()" ng-href="mailto:{{list}}" target="_blank">
Email All {{selected.field}} Volunteers ({{(names | filter:filters).length}})</a>

如果选择下拉列表已更改,则再次运行该功能

  $scope.hasChanged = function() {
    $scope.filters = $scope.selected.field;   
    $scope.getEmails();
  }

现在感到非常自豪:D