视图不会更新AngularJS [英] view is not updated in AngularJS

问题描述

我有一个问题，当我试图显示的数据。

• 我把我的形式和更新我的数据库中的（它的伟大工程，后端是确定）的


• 我用的是页面上的一个按钮，返回到主页


• 主页的观点是不更新，总是相同的值。
  （似乎只存在模板负载，而不是与查询）

我需要点击浏览器的刷新按钮，看到新的数值。

硬刷新后，该视图更新。

为什么我需要完全刷新页面？

下面是我的code

JS：

我的服务 GenericService
（我创造了这个服务，因为我使用这几种控制器）

  myApp.factory（'GenericService'，函数（$ HTTP，$ Q，MyFunctions）{
    VAR数据= {};    功能getDataIfNeeded（动作）{        行动=行动|| '默认';        如果（数据[动作]！==未定义）{
            返回$ q.when（数据[动作]）;
        }        返回$ HTTP（{
            网址：PHP /的functions.php
            方法：GET，
            params：一个{
                动作：动作，
                假：MyFunctions.randomString（7）
            }
        }）。然后（功能（响应）{
            数据[动作] = response.data;
            返回数据[动作]
        }）;
    }    返回{
        的getData：getDataIfNeeded
    };
}）;
 

该服务的调用

  myApp.controller（'的listctrl'，['$范围，$ HTTP，$ rootScope'，'$的位置，GenericService'，
功能（$范围，$ HTTP，$ rootScope，$位置，GenericService）{  GenericService.getData（get_projects）。然后（功能（数据）{
    $ scope.projects =数据;
  }）;  GenericService.getData（get_projects_draft）。然后（功能（数据）{
    $ scope.projects_in_draft =数据;
  }）; }]）;
 

HTML：

 ＆LT; D​​IV NG控制器=listctrl的＆GT;
 ＆LT; D​​IV NG重复=项目工程＆GT;
       ＆LT;跨度＆GT; {{project.nom}}＆LT; / SPAN＆GT;
 ＆LT; / DIV＆GT;
 ＆LT; D​​IV NG重复=project_draft在projects_in_draft＆GT;
       ＆LT;跨度＆GT; {{project_draft.nom}}＆LT; / SPAN＆GT;
 ＆LT; / DIV＆GT;
＆LT; / DIV＆GT;
 

解决方案

您服务 GenericService 只从如果需要的服务器，这意味着如果本地获取数据数据变量是不是空的。当然，无需重新加载的服务和表单提交后，数据将出同步的！所以，你有两个选择：

如果服务器创建额外的数据后，即拥有了AngularJS不表单提交后都有数据，你需要做的另一个请求，以获取新的数据。刚空本地数据变量。

否则，如果服务器只是节约比如在数据库中的数据，并且不与对什么是你的页面上显示的影响进行任何其他操作，不必做一个其它的请求，因为你已经知道你发送至服务器的！刚刚的更新本地数据变量。

I have an issue when I try to display data.

• I send my form and update my database (it works great, backend is ok)
• I use a button on the page to return to homepage
• The view of the homepage is not updated, always the same values. (It seems that there is only the template that loads, not with queries)

I need to click on the button refresh of the browser to see new values.

After the 'hard' refresh, the view is updated.

Why do I need to completely refresh the page ?

Here is my code

JS :

My service GenericService (I created this service because I use this in several controllers)

myApp.factory('GenericService', function ($http, $q, MyFunctions) {
    var data = {};

    function getDataIfNeeded(action) {

        action = action || 'default';

        if (data[action] !== undefined) {
            return $q.when(data[action]);
        }

        return $http({
            url: "php/functions.php",
            method: "GET",
            params: { 
                action: action, 
                dummy: MyFunctions.randomString(7)
            }
        }).then(function(response) {
            data[action] = response.data;
            return data[action];
        });
    }

    return {
        getData: getDataIfNeeded
    };
});

The call of the service

myApp.controller('listCtrl', ['$scope', '$http', '$rootScope', '$location', 'GenericService',
function ($scope, $http, $rootScope, $location, GenericService) {

  GenericService.getData("get_projects").then(function (data) {
    $scope.projects = data;
  }); 

  GenericService.getData("get_projects_draft").then(function (data) {
    $scope.projects_in_draft = data;
  }); 

 }]);

HTML :

<div ng-controller="listCtrl">
 <div ng-repeat="project in projects">
       <span>{{ project.nom }}</span>
 </div>
 <div ng-repeat="project_draft in projects_in_draft">
       <span>{{ project_draft.nom }}</span>
 </div>
</div>

解决方案

Your service GenericService fetch the data from the server only "if needed", which means if the local data variable isn't empty. Naturally, without reloading the service and after a form submission, the data will be out-of-sync! So you have two choices:

If the server is creating additional data, i.e. possesses data that AngularJS don't have after the form submission, you need to do another request in order to fetch the new data. Just empty the local data variable.

Else, if the server is just saving the data in a database for instance, and doesn't perform any other operation with an impact on what is shown on your page, you don't have to do an other request, since you already know what you sent to the server! Just update the local data variable.

这篇关于视图不会更新AngularJS的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！