AngularJS не обновляет представление до обновления?

Question

В настоящее время я столкнулся с проблемой, которая связана с видами. Я создаю приложение, которое позволяет пользователям создавать опросы. Когда опрос, который пользователь создает представляется, я называю маршрут POST, чтобы сохранить его:

$scope.userVal = Auth.getCurrentUser(); 
$http.post('/api/users/update' + $scope.userVal._id, {polls: $scope.polls}).success(function(res){ 
      //console.log("res: ", res); 
     }); 

По сути, я получаю информацию о пользователе, а также использовать его идентификатор, чтобы сохранить новый опрос в схеме определены значения под названием опросы.

Теперь, когда пользователь нажимает на кнопку, вывожу опросы, которые были созданы с помощью нг ракурса:

$scope.pollView= function(){ 
     $scope.userVal2 = Auth.getCurrentUser(); 
     $scope.userVal2 = $scope.userVal2.polls; 

     $scope.button = true; 
    }; 

В HTML, я просто перебрать $ scope.userVal2. Моя проблема возникает, когда я пытаюсь просмотреть недавно созданный опрос. Опрос изначально не появляется, но если я обновляю страницу, она появляется. Есть ли причина для этого? Это связано с асинхронными вызовами?

Любая помощь будет оценена!

редактировать:

Контроллер:

'use strict'; 

angular.module('voteApp') 
    .controller('WallCtrl', function ($scope, $http, Auth) { 
    $scope.items = []; 
    $scope.title; 

    $scope.button = false; //set default to the new poll 

    $scope.polls = []; 

    $scope.items.push({id:1, upvotes:0, text:""}); 
    $scope.items.push({id:2, upvotes:0, text:""}); 

    $scope.addOptions = function(){ 
     $scope.items.push({id:$scope.items.length +1, upvotes:0, text:""}); 
    }; 

    $scope.process = function(name, values){ 
     $scope.polls.push({title:name, options:values}); 
     $scope.title = ""; //reset the values for the next poll 
     $scope.items = []; 
     $scope.items.push({id:1, upvotes:0, text:""}); 
     $scope.items.push({id:2, upvotes:0, text:""}); 

     $scope.userVal = Auth.getCurrentUser(); 
     $http.post('/api/users/update' + $scope.userVal._id, {polls: $scope.polls}).success(function(res){ 
      //console.log("res: ", res); 
     }); 
    }; 

    $scope.newView= function(){ 
     $scope.button = false; 
    }; 

    $scope.pollView= function(){ 
     $scope.userVal2 = Auth.getCurrentUser().polls 

     $scope.button = true; 
    }; 

    $scope.delete = function(val){ 
     $scope.polls = $scope.polls.filter(function(returnableObjects){ 
       return returnableObjects.title !== val.title; 
     }); 
    }; 
    }); 

HTML:

<div ng-include="'components/navbar/navbar.html'"></div> 

<header class="hero-unit" id="banner"> 
    <div class="container"> 
    <h1>Dashboard</h1> 
    <p class="lead">What would you like to do today?</p> 
    <button ng-click="newView()" type="button" class="btn btn-lg newpoll">New Poll</button> 
    <button ng-click="pollView()"type="button" class="btn btn-lg mypolls">My Polls</button> 
    </div> 
</header> 

<div ng-show= "!button"> 
    <form name="form" ng-submit="process(title, items)"> 
    <h2 class="col-md-12 text-center">New Poll</h1> 
    <h5 class="col-md-12 text-center">Name your poll.</h1> 
    <input name="pollname" ng-model="title"type="text" class="form-control input_width" placeholder="Poll Name" required> 
    <br> 
    <h5 class="col-md-12 text-center">Options</h1> 
    <div ng-repeat="item in items"> 
     <p> 
      <input name = "{{item.id}}" ng-model="item.text" type="text" class="form-control input_width" placeholder="Option {{item.id}}" required> 
     </p> 
    </div> 
    <br> 
    <div class="text-center"> 
     <button type="button"ng-click="addOptions()" class="btn options" formnovalidate>More Options</button> 
    </div> 
    <br> 
    <div class="text-center"> 
     <button type="submit" class="btn button" validate>Submit</button> 
    </div> 
    </form> 
</div> 

<div ng-show="button" > 
    <br> 
    <div ng-repeat="poll in userVal2"> 
     <div class="polldeco"> 
      {{poll[0].title}} 
      <button class="btn buttondeco" ng-click="delete(poll)">Delete</button> 
     </div> 
    </div> 
</div> 

Answer 1

Некоторые идеи:

1. $scope.userVal2 = Auth.getCurrentUser().polls использует старую версию, перед созданием нового голосование? Возможно, это может быть изменено на что-то вроде Auth.getCurrentUser().then(...). В любом случае, убедитесь, что вызов getCurrentUser() возвращает новые данные.
2. ng-view хранится в кэше. Когда шаблон запрашивается первоначально, он сохраняется в $templateCache. Если этот шаблон визуализируется на бэкэнд для отображения в виде частичного (например: ng-view), и он не является статическим контентом, тогда вам придется сделать недействительным кеш для обновления представления.

3. Рассмотрите возможность возврата нового запроса от $http.post('/api/users/update' ...) и добавления его в список, используемый ng-repeat. Что-то вроде:

   $scope.process = function(name, values) { 
   
       $scope.polls.push({title:name, options:values}); 
       ... 
       $http.post('/api/users/update' + $scope.userVal._id, {polls: $scope.polls}).success(function(poll){ 
        $scope.polls.push(poll); 
       }); 
   }; 
   

   ...

   <div ng-repeat="poll in polls"> 
       <div class="polldeco"> 
        {{poll[0].title}} 
        <button class="btn buttondeco" ng-click="delete(poll)">Delete</button> 
       </div> 
   </div>