2016-07-26 46 views
1

我一直在試圖解決這個問題,並一直在尋找。如果這聽起來很愚蠢,或者在我錯過的地方有重複的問題,請事先道歉。用angularJS創建動態的html電子郵件和用php郵件

我想創建動態電子郵件內容並通過PHP郵件發送電子郵件。我想使用angularJS來編譯html內容並使用$ http.post方法發送到submit.php來發送電子郵件。

我可以在PHP中手動輸入html內容並且沒有問題,但編譯動態html是問題所在。

我真的不太清楚如何解決這個問題,所以任何幫助將不勝感激。

感謝,

我的角度控制器:

$scope.url = 'submit.php'; 

    $scope.formsubmit = function(isValid) { 


     if (isValid) { 


      $http.post($scope.url, {"name": $scope.name, "email": $scope.email, "message": $scope.message }). 
        success(function(data, status) { 
         console.log(data); 
         $scope.status = status; 
         $scope.data = data; 
          $scope.result = data; 
}) 
} 
} 

submit.php

$post_date = file_get_contents("php://input"); 
$data = json_decode($post_date); 
$to = $data->email; 
$from = "[email protected]"; 
$name = $data->name; 
$subject = "Email from AngularJS"; 

$htmlContent = $data->message; 

我已經添加下面我的代碼:

的index.html:

<!DOCTYPE html> 
<html lang="en"> 

<head> 
    <meta charset="utf-8"> 
    <title>Dynamic Email AngularJS</title> 

</head> 

<body ng-app="myApp" ng-cloak> 

    <div ng-controller="formCtrl"> 


    <pre ng-model="result"> 
       {{result}} 
    </pre> 
    <form name="userForm"> 
    <input type="text" class="form-control" ng-model="$parent.name" placeholder="Name Lastname" required> 
    <input type="text" class="form-control" ng-model="$parent.email" placeholder="[email protected]" required> 


    <div ng-view></div> 
    <button ng-click="add()">New Item</button> 
    <button type="submit" class="btn" ng-click="formsubmit(userForm.$valid)" ng-disabled="userForm.$invalid">Submit </button> 
    </form> 
    </div> 

    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular.min.js"></script> 

    <script src="//code.angularjs.org/1.4.3/angular-route.min.js"></script> 
    <script src="app.js"></script> 


</body> 

</html> 

app.js:

myApp.controller( 「formCtrl」,[ '$範圍', '$ HTTP', '$ templateRequest', '$編譯',函數($範圍,$ http,$ templateRequest,$ compile){

$scope.lists = [ 
{ 
"year":"year I", 
"semesters":[ 
       { 

       "label": "Semester I", 
       "max": "4", 
       "courses": [ 
        {"name": "Introductory Accounting I", "type": "populated"}, 
        {"name": "Principles of Economics I", "type": "populated"}, 
       ] 
       }, 

       { 
       "label": "Semester II", 
       "max": "4", 
       "courses": [ 
        {"name": "Accounting Method II", "type": "populated"}, 

       ] 
       } 
     ] 
}, 

{ 
"year":"year II", 
"semesters":[ 
       { 
       "label": "Semester I", 
       "max": "4", 
       "courses": [ 
        {"name": "Introductory Accounting I", "type": "levelII"}, 
        {"name": "Business Finance I", "type": "levelII"} 
       ] 
       }, 

       { 
       "label": "Semester II", 
       "max": "4", 
       "courses": [ 
        {"name": "Accounting Method II", "type": "levelII"}, 
        {"name": "Management Accounting II", "type": "levelII"}, 

       ] 
       } 
     ] 
} 
] 

$scope.add = function() { 
    $scope.lists.push(
     { 
"year":"year III", 
"semesters":[ 
       { 
       "label": "Semester I", 
       "max": "4", 
       "courses": [ 
        {"name": "Introductory Accounting I", "type": "levelII"}, 
        {"name": "Business Finance I", "type": "levelII"} 
       ] 
       }, 

       { 
       "label": "Semester II", 
       "max": "4", 
       "courses": [ 
        {"name": "Accounting Method II", "type": "levelII"}, 
        {"name": "Management Accounting II", "type": "levelII"}, 

       ] 
       } 
     ] 
}); 
} 

$scope.url = 'submit.php'; 

$scope.formsubmit = function(isValid) { 

    if (isValid) { 

     $templateRequest('email.html').then(function(html) { 

     $scope.contentHtml = $compile(html); 
     }); 
     $http.post($scope.url, {"name": $scope.name, "email": $scope.email, "message": $scope.contentHtml }). 
       success(function(data, status) { 
        console.log(data); 
        $scope.status = status; 
        $scope.data = data; 
        $scope.result = data; 
       }) 
    }else{ 

      alert('Form is not valid'); 
    } 
} 

}]);

submit.php:

<?php 


$post_date = file_get_contents("php://input"); 
$data = json_decode($post_date); 
$to = $data->email; 
$from = "[email protected]"; 
$name = $data->name; 
$subject = "Dynamic Email"; 


$htmlContent = $data->message; 

// Set content-type header for sending HTML email 
$headers = "MIME-Version: 1.0" . "\r\n"; 
$headers .= "Content-type:text/html;charset=UTF-8" . "\r\n"; 

// Additional headers 
$headers .= 'From: '.$from . "\r\n"; 


if(mail($to,$subject,$htmlContent,$headers)) { 

    echo "Mail Sent. Thank you " . $name . ", we will contact you shortly.";  

} else { 


    echo 'Sorry there was an error sending your message. Please try again later.'; 

} 


echo "Name : ".$data->name."\n"; 
echo "Email : ".$data->email."\n"; 
echo "Hero : ".$data->hero."\n"; 
echo "Message": $htmlContent; 



?> 

email.html

<table ng-repeat="list in lists"> 
    <tr> 
     <td> 
      <h1>{{list.year}}</h1> 
     </td> 
    </tr> 
    <tr> 
     <td ng-repeat="semester in list.semesters"> 
      <table> 
       <tr> 
        <td> 
         <h3>{{semester.label}}</h3> 


         <ul> 
          <li ng-repeat="course in semester.courses">{{course.name}}</li> 
         </ul> 

        </td> 
       </tr> 
      </table> 
     </td> 

    </tr> 
</table> 

回答

0

我必須做同樣的事情。但是我的設置有些不同。我的後端是一個Firebase.com數據庫。通過angularFire加載到我的前端,用於將東西加載到角度項目中的庫。我在前端有一個郵件模板。事實上,我計劃讓用戶從幾個提供的電子郵件模板中選擇他們的電子郵件模板。我只是填寫字段,但像MS-Office中的郵件合併。 在服務器端,我使用的是php-mailer(谷歌它!) 這是發生了什麼事情: - 創建像mailTo(所有電子郵件我必須發送郵件)的變量,並將它們綁定到$範圍(是的,我知道我不應該這樣做,但留在我身邊) - 來自應該在郵件中的數據庫記錄的其他stuf,我再次綁定到$範圍。 - 然後我做到這一點:需要

$templateRequest("templates/mail-packs/mail-1.html") 
     .then(function(emailtemplate) { 
      var base = angular.element('<div></div>'); 
      base.html(emailtemplate); 
      $compile(base)($scope); 
      $timeout(function(){ 
        mail = base.html() 
        console.log(mail); 
        constructMail(mail) 
      }, 300) 
     }) 

基地variabel beceause你是不是compling到DOM。你必須在那裏欺騙角色,並開始一個空白的DOM。 函數constructMail()是一個函數,它準備將數據發送到php-mailer。

相關問題