在HotTowel Angular的微风1米-1,带有本地存储空间

时间:2014-02-05 11:39:41

标签: angularjs breeze hottowel

我最近要求实现用于管理多对多关系的UI。 Ward Bell友好地提供了this plunker,展示了如何使用1-m-1与Angular和Breeze实现。

我的应用程序的设计主要基于(特别是datacontext和本地存储)主要基于John Papa最近的Pluralsight课程。

在我的应用程序中,BusUnit = Hero和Dimension = Power(参考Ward的例子。

当我强制应用程序从服务器获取数据时,一切似乎都运行正常,因为我对业务单位维度的更新反映正确。我现在面临的问题是当我离开页面并再次返回时(从本地存储中获取数据)。在这种情况下:

  • 如果我之前为业务部门添加了新维度,一切正常,但
  • 如果我之前已将业务单位的维度标记为删除和保存,则该维度仍会显示在相关业务单位中。

这是最初获取业务单位及其维度的控制器代码:

function getdboardStructure() {
        var busUnitsPromise = datacontextSvc.busUnits.getByDboardConfigId(vm.dboardConfig.id);
        var dimensionsPromise = datacontextSvc.dimensions.getByDboardConfigId(vm.dboardConfig.id);

        $q.all([busUnitsPromise, dimensionsPromise])
            .then(function (values) {
                vm.busUnits = values[0];
                vm.dims = values[1];
                createBusUnitVms();
                //vm.currentBusUnitVm = vm.busUnitVms[0]; // not required as using accordion instead of drop-down
                vm.hasChanges = false;
            });
    }

这是我的控制器中准备保存的代码:

function applyBusUnitDimensionSelections(busUnitVm) {
        var busUnit = busUnitVm.busUnit;
        var mapVms = busUnitVm.dimensionMapVms;
        var dimensionHash = createBusUnitDimensionHash(busUnit);

        mapVms.forEach(function (mapVm) {
            var map = dimensionHash[mapVm.dimension.id];

            if (mapVm.selected) {
                if (!map) {
                    datacontextSvc.busUnits.addBusUnitDimension(busUnit, mapVm.dimension)
                    .then(function () {
                    });
                }
            } else {
                if (map) {
                    datacontextSvc.markDeleted(map);
                }
            }
        });
    }

这是我的控制器中执行保存的代码:

function save() {
        if (!canSave()) {
            return $q.when(null);
        }

        vm.isSaving = true;
        vm.busUnitVms.forEach(applyBusUnitDimensionSelections);
        return datacontextSvc.save().then(function (saveResult) {
            vm.isSaving = false;
            trapSavedDboardConfigId(saveResult); // not relevant to use case
        }, function (error) {
            vm.isSaving = false;
        });
    }

这是我的存储库中添加新的busUnitDimension实体的代码:

function addBusUnitDimension(busUnit, dimension) {
        var newBusUnitDimension = this.em.createEntity(busUnitDimension);
        newBusUnitDimension.busUnitId = busUnit.id;
        newBusUnitDimension.dimensionId = dimension.id;
        return this.$q.when(newBusUnitDimension);
    }

这是我用于标记已删除项目的datacontext代码:

function markDeleted(entity) {
        return entity.entityAspect.setDeleted();
    } 

最后这是获取业务单位及其连接表实体的存储库代码:

function getByDboardConfigId(dboardConfigId, forceRefresh) {
        var self = this;
        var predicate = pred.create('dboardConfigId', '==', dboardConfigId);
        var busUnits;

        if (self.zStorage.areItemsLoaded('busUnits') && !forceRefresh) {
            busUnits = self._getAllLocal(entityName, orderBy, predicate);
            return self.$q.when(busUnits);
        }

        return eq.from('BusUnits')
            .expand('BusUnitDimensions')
            .where(predicate)
            .orderBy(orderBy)
            .using(self.em).execute()
            .to$q(succeeded, self._failed);

        function succeeded(data) {
            busUnits = data.results;
            self.zStorage.areItemsLoaded('busUnits', true);

            self.zStorage.save();
            //self.logSuccess('Retrieved ' + busUnits.length + ' business units from server', busUnits.length, true);
            return busUnits;
        }
    }

我离开John的课程示例是我在我使用的函数中使用expand来从服务器获取业务单元,我的假设是这与微风每次都要进入服务器的事实有关我刷新了页面(没有清除缓存),而且如果我离开然后返回页面,这也与我收到的错误有关。

有人可以提供和建议吗?

1 个答案:

答案 0 :(得分:1)

欣赏这是很久以前的事了,你可能已经解决了这个问题或继续前进但是我最近遇到了同样的问题,这个问题花了我很多时间来解决。 我找到的答案是你必须编辑JP的angular.breeze.storagewip.js文件。 我包含硬编码到文件中的实体的名称,您需要更改这些实体以匹配您自己的实体。

您需要执行以下两个功能,下面的示例显示了我正在使用的四个实体的更改:

function zStorageCore($rootScope, zStorageConfig) {
    var storeConfig = zStorageConfig.config;
    var storeMeta = {
        breezeVersion: breeze.version,
        appVersion: storeConfig.version,
        isLoaded: {
          elementAssets : false,
          surveyors : false,
          elements : false,
          assets : false
        }
    };

和...

    function checkStoreImportVersionAndParseData(importedData) {
        if (!importedData) {
            return importedData;
        }
        try {
            var data = JSON.parse(importedData);
            var importMeta = data[0];
            if (importMeta.breezeVersion === storeMeta.breezeVersion &&
                importMeta.appVersion === storeMeta.appVersion) {
              if (importMeta.isLoaded) {
                storeMeta.isLoaded.assets = storeMeta.isLoaded.assets || importMeta.isLoaded.assets;
                storeMeta.isLoaded.elements = storeMeta.isLoaded.elements || importMeta.isLoaded.elements;
                storeMeta.isLoaded.surveyors = storeMeta.isLoaded.surveyors || importMeta.isLoaded.surveyors;
                storeMeta.isLoaded.elementAssets = storeMeta.isLoaded.elementAssets || importMeta.isLoaded.elementAssets;
              }
                return data[1];
            } else {
                _broadcast(storeConfig.events.error,
                    'Did not load from storage because mismatched versions',
                    { current: storeMeta, storage: importMeta });
            }
        } catch (ex) {
            _broadcast(storeConfig.events.error, 'Exception during load from storage: ' + ex.message, ex);
        }
        return null; // failed
    }

我通过将JP的风格指南课程文件与他的SPA / Angular / Breeze课程进行比较来解决这个问题。