出厂解析后,AngularJs控制器值不会更新

时间:2016-09-13 02:39:20

标签: angularjs angular-promise

我正在尝试构建一个用户页面,其中显示了它的主要数据,详细信息,地址等。当我第一次加载时,它在屏幕上不会显示,直到我更改页面并返回到用户页面。这是一个问题,因为我已经去了那个页面后回复了承诺。

我不能(不想)在resolve stateChange期间加载此数据,因为它会让应用程序感到冻结,因为它只会改变屏幕数据为resolved,如果需要一些时间,则该页面似乎无效。

我还尝试使用$scope.$digest()上的controller$rootScope.$apply()上的factory,但两种情况都会给我digest running错误。

使用.then()不是一个选项(除非有正确的方法),因为如果我在第一次加载后返回该页面,则会出现错误。

我加载的方式来自parent(摘要)controller并将这些值存储在factory中,如下所示:

//Parent Controller
function parentController(requestFactory, storeFactory, $q) {
    var
        user = storeFactory.userGet(),
        data = storeFactory.dataGet()
        [...more load...];

    if(!user || !data ...) {
        var promises = {
            user:    requestFactory.get('userGet'),
            data:    requestFactory.get('dataGet'),
            [...more requests...]
        };

        return $q.all(promises).then(function(resolve){
            storeFactory.userAdd(resolve.user);
            storeFactory.dataAdd(resolve.data);
            [...more update...]
        });
    }
}

//Factory
function storeFactory() {
    var 
        data    = null,
        user    = null,
        address = null,
        endereco = null;

    var service = {
        userGet: _userGet,
        userAdd: _userAdd,
        [...more definitions...]
    };
    return service;


    function _userGet() {
        return user;
    }
    function _userAdd(data) {
        return user = data;
    }
    [...more functions...]
}

// child Controller 01
function child1Controller(storeFactory) {
    vm.user = storeFactory.userGet();
}

// child Controller 02
function child2Controller(storeFactory) {
    vm.address = storeFactory.addressGet();
}

我还需要在开头加载所有这些数据,因为存在依赖数据,例如,地址取决于用户等。

所以,如果我访问页面 user>地址它没有在屏幕上显示任何内容,但如果我转到其他页面然后回来,一切都会显示出它应该显示的内容。

有没有办法解决这个问题?要自动更新数据吗?

1 个答案:

答案 0 :(得分:0)

我可以解决这个问题的方法是在工厂中创建一个带有嵌套数组的单个对象,而不是创建多个数组。另外,在控制器中,我无法将特定数组直接设置为vm,我需要在对象内部设置数组,这样它就会自动更新。

//Factory
var data = {
    user: null,
    address: null,
    [...]
};

function _userAdd(value) {
    return data.user = value;
}
[...etc...]

//Controller
function child1Controller(storeFactory) {
    vm.maindata = storeFactory.data;
}

执行此操作后,我需要在视图上指定嵌套数组,如下所示:

<p>{{vm.maindata.user}}</p>

<ul>
    <li ng-repeat="address in vm.maindata.address track by $index">{{address}}</li>
</ul>

即使它正在工作,但感觉不是正确的方法,所以,如果有更好的方法来实现这一结果,我愿意接受建议。