MomentJS和函数返回NaN

时间:2018-03-01 18:37:09

标签: javascript momentjs

此处的目标是让用户能够将具有该员工的一些基本信息的员工添加到数据库,并且该程序将员工列表打印到表格中的HTML。我还需要计算自员工开始工作以来支付给员工的总工资。我不应该保存数据库中保存的时间差异,而是计算每个数据库拉/推的时间。

我正在使用firebase作为我的数据库。

我有一个calculateMonthsWorked函数。 MonthsWorked是一个初始化为0的全局变量。

 function calculateMonthsWorked() {
        startDate = (moment(startDate, "MM/DD/YYYY").format("MM/DD/YYYY"))
        monthsWorked = (moment().diff(moment(startDate, "MM/DD/YYYY"), "months"))
        console.log("months worked is " + monthsWorked + " and the type is " + typeof monthsWorked)
}

我调用此函数来测试它是否在我的click事件结束时起作用。它似乎正确地计算了它。

$('#submitBTN').on('click', function(){
        event.preventDefault();
        // get values of user inputs
        var name = $('#name').val().trim();
        var role = $('#role').val().trim()
        startDate = $('#startDate').val().trim()
        monthlyRate = $('#monthlyRate').val().trim();
        // clear values
        $('#name').val("");
        $('#role').val("");
        $('#startDate').val("");
        $('#monthlyRate').val("");
        databaseRef.push({
            name: name,
            role: role,
            startDate: startDate,
            monthlyRate: monthlyRate
        });
        calculateMonthsWorked()
    })

当我从数据库中获取数据以便在重新加载时打印到表中时,我在这里调用calculateMonthsWorked函数。

databaseRef.on("child_added", function(snapshot, prevChildKey) {
        var newEmployee = snapshot.val();
        calculateMonthsWorked()
        $('#employeeTable').append("<tr><td>" + newEmployee.name + "</td><td>" + newEmployee.role + "</td><td>" + newEmployee.startDate + "</td><td>" + monthsWorked + "</td><td>$" + newEmployee.monthlyRate + "</td><td></td></tr>");
    });

但这样做会将所有内容更改为NaN,现在它说它不再是控制台中的数字。

enter image description here

希望按顺序查看所有内容的完整脚本。

$(document).ready(function(){

    // Initialize Firebase
    var config = {
        apiKey: "AIzaSyDcNRNdiPbOezI3PsGPQ-kS9u79G8eaYoU",
        authDomain: "database-practice-bda3.firebaseapp.com",
        databaseURL: "https://database-practice-bda3.firebaseio.com",
        projectId: "database-practice-bda3",
        storageBucket: "",
        messagingSenderId: "498652093118"
    };

    firebase.initializeApp(config);

    var databaseRef = firebase.database().ref();
    var monthsWorked = 0;
    var totalBilled = 0;
    var startDate = null;
    var monthlyRate = 0;



    function calculateMonthsWorked() {
        startDate = (moment(startDate, "MM/DD/YYYY").format("MM/DD/YYYY"))
        monthsWorked = (moment().diff(moment(startDate, "MM/DD/YYYY"), "months"))
        console.log("months worked is " + monthsWorked + " and the type is " + typeof monthsWorked)
    }

    // function calculateTotalBilled(){
    //     totalBilled = monthsWorked * monthlyRate;
    // }

    databaseRef.on("child_added", function(snapshot, prevChildKey) {
        var newEmployee = snapshot.val();
        calculateMonthsWorked()
        $('#employeeTable').append("<tr><td>" + newEmployee.name + "</td><td>" + newEmployee.role + "</td><td>" + newEmployee.startDate + "</td><td>" + monthsWorked + "</td><td>$" + newEmployee.monthlyRate + "</td><td></td></tr>");
    });


    $('#submitBTN').on('click', function(){
        event.preventDefault();
        // get values of user inputs
        var name = $('#name').val().trim();
        var role = $('#role').val().trim()
        startDate = $('#startDate').val().trim()
        monthlyRate = $('#monthlyRate').val().trim();

        // clear values
        $('#name').val("");
        $('#role').val("");
        $('#startDate').val("");
        $('#monthlyRate').val("");

        databaseRef.push({
            name: name,
            role: role,
            startDate: startDate,
            monthlyRate: monthlyRate
        });

        calculateMonthsWorked()
    })

});

1 个答案:

答案 0 :(得分:0)

这是我要改变的地方:

function calculateMonthsWorked(startDate) {
    var startDate = moment(startDate, "MM/DD/YYYY");
    var monthsWorked = moment().diff(startDate, "months");
    console.log("months worked is " + monthsWorked + " and the type is " + typeof monthsWorked);
    return monthsWorked;
}

上面的代码将删除双重解析,并返回其调用者的月数。后:

databaseRef.on("child_added", function(snapshot, prevChildKey) {
    var newEmployee = snapshot.val();
    var monthsWorked = calculateMonthsWorked(newEmployee.startDate);
    $('#employeeTable').append("<tr><td>" + newEmployee.name + "</td><td>" + newEmployee.role + "</td><td>" + newEmployee.startDate + "</td><td>" + monthsWorked + "</td><td>$" + newEmployee.monthlyRate + "</td><td></td></tr>");
});

请注意,我们在此处将开始日期从newEmployee传递给该函数。之前没有任何内容将startDate(变量)连接到newEmployee.startDate(属性)。

从上方删除monthsWorkedstartDate的声明。

您可能需要考虑将将databaseRef.on函数设置为HTML的代码移动到自己的代码中,以便您可以在其他地方调用它(例如在您的onclick处理程序中)。