在angular中使用Javascript和firebase

我试图在angular中使用firebase，但不知道为什么我的localhost不能与我的javascript一起工作。 如果我把所有代码都放在index.html中，它会运行得很好，但我只是想知道为什么在使用localhost时它不能在我的contact.component.html中运行。 看起来我的javascript无法在html中运行

//这是我的main.js
//初始化Firebase（添加您自己的数据）
变量配置={
apiKey:“…”，
authDomain:“listing-ed9ac.firebaseapp.com”，
数据库URL:“https://listing-ed9ac.firebaseio.com",
projectId:“listing-ed9ac”，
storageBucket:“listing-ed9ac.appspot.com”，
messagingSenderId：“122342013620”
};
firebase.initializeApp（配置）；
//参考邮件收集
var messagesRef=firebase.database（）.ref（'messages'）；
//收听表格提交
document.getElementById（'contactForm'）。addEventListener（'submit'，submitForm'）；
//提交表格
函数提交形式（e）{
e、 预防默认值（）；
//获取价值
var name=getInputVal（'name'）；
var company=getInputVal（“公司”）；
var email=getInputVal（“电子邮件”）；
var phone=getInputVal（'phone'）；
var message=getInputVal（'message'）；
//保存消息
保存信息（姓名、公司、电子邮件、电话、信息）；
//清晰的形式
document.getElementById（'contactForm'）.reset（）；
}
//函数来获取表单值
函数getInputVal（id）{
return document.getElementById（id）.value；
}
//将消息保存到firebase
功能保存信息（姓名、公司、电子邮件、电话、信息）{
var newMessageRef=messagesRef.push（）；
newMessageRef.set({
姓名:姓名,，
公司:公司,，
电邮:电邮,，
电话:电话,，
信息：信息
});
}

//这是我的contact.component.html
尝试
联系我们
汽车租赁
汽车租赁

通过联系表格与我们联系。租车部将很快与您联系。

给我们发电子邮件
您的邮件已发送

名称


单位


电子邮件地址


电话号码


消息


提交


霍克出租汽车（M）私人有限公司


雪兰莪州达鲁尔埃桑市苏邦贾亚47500号苏邦贾亚工业区Jalan SS13/3E 4号


电话：1300886488（马来西亚境内）/+603-56316488


传真：+603-56356466


电邮：reservations@hawkrentacar.com.my

版权及副本；2017年由ckyong设计

这是一个老问题，但很多角度（2+）的新手可能会面临这个问题。 共享的代码片段仅适用于纯JavaScript（普通JavaScript）。 对于不同的角度，安装angularfire2模块，然后继续。angularfire2模块中的语法不同

---

如果我是对的，使用angularfire2的TypeScript将被转换为等效的JavaScript（与您共享的代码类似）

您能在组件的.ts文件中提供完整的代码吗？我特别要说的是你的类的构造函数和你导入的模块。这是我的源代码，我想知道我的子组件contact.component.html上的问题……因为我尝试单击submit按钮，意识到当表单没有填写我可以给你的建议时，它没有发出警报很快，您就需要在项目中安装并从“angularfire2/database”导入{AngularFireDatabase，FirebaseListObservable}。也许看看这个回购协议会对你有所帮助：为什么找不到Firebase的普通实现呢。Firebase SDK并没有那么难使用，我认为不需要包装器……Firebase的普通实现非常简单，我同意。由于框架支持组件创建和组件的可重用性，我不得不使用框架，但没有明确的文档或指南将firebase用于Angular或react等框架。像我这样自学成才的新手发现很难将firebase与框架结合使用。