我的模型绑定发生了什么？

Kevin 发表于 Dev

凯文

我有一个小的 AngularJs 应用程序，它使用$resource. 资源 ( salesOrderResource) 返回我绑定到模型的vm.rowData. 我将返回的资源写出到控制台以表明我确实有数据：

但是，一旦在资源的query功能之外，vm.rowData就会突然undefined：

我不明白为什么会这样。我希望有人可以对这里发生的事情有所了解。

这是我的控制器：

(function () {
    "use strict";

    angular
        .module("app")
        .controller("SalesOrderListCtrl", ["salesOrderResource", SalesOrderListCtrl]);

    function SalesOrderListCtrl(salesOrderResource) {
        var vm = this;            

        vm.columnDefs = [
            { headerName: "Sales Order#", field: "SalesOrderNumber" },
            { headerName: "Lot#", field: "LotNumber" },
            { headerName: "Qty", field: "Quantity" },
            { headerName: "Status", field: "Status" },
            { headerName: "Branch", field: "Branch" }
        ];

        salesOrderResource.query(function (data) {
            vm.rowData = data;
            console.log("In query function:");
            console.log(vm.rowData);
        })     

        console.log("Outside query function:");
        console.log(vm.rowData);

        vm.gridOptions = {

            // PROPERTIES - object properties, myRowData and myColDefs are created somewhere in your application
            rowData: vm.rowData,
            columnDefs: vm.columnDefs,

            // PROPERTIES - simple boolean / string / number properties
            enableColResize: true,
            rowHeight: 22,
            rowSelection: "single",

            // EVENTS - add event callback handlers
            onRowClicked: function (event) { console.log("a row was clicked"); },
            onColumnResized: function (event) { console.log("a column was resized"); },
            onGridReady: function (event) { console.log("the grid is now ready"); },

            // CALLBACKS
            isScrollLag: function () { return false; }
        }           
    }
})();

罗伯特一世

$resource.query 是异步的。您的外部查询功能将在您的查询功能完成之前打印。

salesOrderResource.query(function (data) {
            vm.rowData = data;
            console.log("In query function:");
            console.log(vm.rowData);
        })

这将发生在 1 日。

console.log("Outside query function:");
console.log(vm.rowData);

尝试将其替换为

setTimeout(function() {
    $scope.$apply(function () {
        console.log("Outside query function delayed:");
        console.log(vm.rowData);
    });
}, 1000);

本文收集自互联网，转载请注明来源。

如有侵权，请联系 [email protected] 删除。