学习使用Angularjs和Node进行编码 - 创建基本联系表单 - 无效的速记属性初始值设定项

时间:2016-10-31 02:18:44

标签: angularjs node.js

首先发布在这里:)

我正在学习使用Angularjs和Node进行编码和编写代码。我已经做了一些javascript课程并且没有遇到任何问题,我的一位朋友向我提出挑战要求我与Angularjs建立一个基本的联系表格,通过Node发送电子邮件以促进我的学习。 / p>

我已经浏览了Angularjs文档,Node文档以及不同的教程和网站,以便找到解决我的问题的解决方案,并且能够继续前进,但却遇到了这个错误。

这是我的代码:

<html>  
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
</head> 
<body>

<div ng-app="myApp">
<form name="mailForm" action="#" ng-controller="MainController">
    To: <input type="email" ng-model="inputTo"><br>
    Subject: <input type="text" name="inputSubject"><br>
    Mail body: <br><textarea name="inputMessage">Type in your message</textarea><br>
    <input type="submit" ngClick="Submit">
</form>
</div>

<script>

var app = angular.module('myApp', []);
app.controller('MainController', function($scope){

    var nodemailer = require('nodemailer'); 
    var transporter = nodemailer.createTransport('smtps://email%40gmail.com:password@smtp.gmail.com');


    $scope.data = {
        inputTo = "default",
        inputSubject = "default",
        inputMessage = "default"
    };

    $scope.submitForm = function(){

        var mailOptions = {
            from: '"Dev ?" <email@email.com>',
            to: {{inputTo}},
            subject: {{inputSubject}},
            text: {{inputMessage}}
        }   

        transporter.sendMail(mailOptions, function(error, info){
            if(error){
            return console.log(error);
            }

            console.log('Message sent: ' + info.response);
        });
    }

})

</script>
</body>
</html>

问题是每当我测试表单时(通过完成它并单击Submit按钮,呃!)我在控制台上出现以下错误:

index.html?inputSubject=test&inputMessage=TEST+Type+in+your+message:26      Uncaught SyntaxError: Invalid shorthand property initializer

angular.js:38 Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/1.4.8/$injector/modulerr?p0=myApp&p1=Error%3A%2…ogleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.4.8%2Fangular.min.js%3A20%3A274)(…)
你能帮我个忙吗?

非常感谢你!

2 个答案:

答案 0 :(得分:0)

您的语法有几个问题。

1)定义对象的正确方法如下: http://www.w3schools.com/js/js_objects.asp

&#13;
&#13;
$scope.data = {
   inputTo: "default",
   inputSubject: "default",
   inputMessage: "default"
};
&#13;
&#13;
&#13;

2)访问控制器用户$ scope.value中的范围值而不是{{value}}

&#13;
&#13;
var mailOptions = {
   from: 'email@email.com',
   to: $scope.inputTo,
   subject: $scope.inputSubject,
   text: $scope.inputMessage
}   
&#13;
&#13;
&#13;

还有其他语法问题,您在html中使用name =而不是ng-model =。

我建议您查看您尝试执行的操作的文档和示例,并首先获得正确的语法。

将代码编写成小部分,并使用chrome的调试工具对每个部分进行测试,这样您就可以看到每个部分都在工作并移动到下一个部分。

从w3schools尝试一两个教程来帮助你学习:http://www.w3schools.com/angular/angular_forms.asp

祝你好运!

答案 1 :(得分:0)

我认为您只是尝试将node.js和angularjs融合在一起。我的第一个提示是当你使用var nodemailer = require('nodemailer');时,你需要在nodejs中使用其他包,angularjs没有这个功能。在快速谷歌搜索nodemailer后,我的怀疑得到了证实。由于nodemailer是nodejs的包,因此您无法在角度应用程序中访问其功能,至少不能直接访问。

您想要做的是在您的angularjs应用程序中调用node.js函数的函数。所以你只需要将当前在angular控制器中的逻辑迁移到它自己的node.js文件中。

nodejs方面有点复杂。您需要定义一个nodejs路由才能够“通话”。与nodejs。因此,基本上每当您在页面中找到某个链接时,都会调用nodejs代码。

例如,可能会:www.base-website-url/create/email将运行保存nodejs代码的server.js文件(与控制器内部相同)。我建议您学习如何在nodejs中创建一个简单的crud应用程序。只是google那个。

此外,现在看来,角度方面的事情也会有点复杂。由于您正在创建某些内容(在本例中为电子邮件对象),因此您需要在angularjs中进行POST(google http谓词)调用,以将电子邮件对象发送到我们的nodejs函数。 Angular提供$http来帮助解决这个问题。 ngResource也是你可以使用的另一个补充模块,但我可能只是坚持学习$ http。

其他一些事情。我知道这是你的第一篇文章,所以我可以理解为什么你可能按照你的方式写你的帖子,但仅仅是为了将来,这里有一些东西可以让你的帖子更有效:

  1. 简短描述,包括标题。如果我的问题不必要地冗长,我不太可能想回答你的问题,我想尽快开始解决问题。

  2. 分享一个实用的代码示例。有几个网站(jsfiddleplunkrcodepen)允许您进行代码涂鸦&#39;正如我所说的那样。他们有一个html面板,css面板和js面板。这使得编写足够的代码以获得一个工作示例并共享其链接变得非常容易。这样任何其他想要帮助解决问题的开发人员,已经有了一些他们可以开始玩的代码。这使得回答你的问题变得容易得多,你甚至可以在创建问题时自己发现错误。 (我不止一次这样做过)

  3. 接受答案。如果答案是正确的,则将其标记为已接受,答案旁边的绿色小检查。这让其他人知道答案对你有用,这样他们就可以对尝试更有信心,也可以奖励响应者。

  4. 除此之外,只要继续学习并尝试至少尽可能多地给予。祝你好运!

相关问题