Question

我是Angular.js的新手，我开始通过单独构建一个小项目来学习它。我很高兴它可以正常发送POST请求和从服务器端获取数据。但是我遇到了一个问题，即在我发出POST请求然后获取新数据（我新创建的）之后，我无法重新呈现我的页面。 View仍在显示我的旧数据。任何人都可以看看它，并告诉我问题出在哪里？我在控制台上收到了信息，但页面没有渲染。在此过程中没有发现任何错误。感谢〜

查看：

<div ng-class="{'tab-pane active': activeTab === 6, 'tab-pane' : activeTab !== 6}">
 <h2>Grill Recipe</h2>
 <hr>
 <div ng-controller="userRecipeController" ng-init="initGet()">
  <ul ng-repeat="recipe in userRecipes | filter: {category: 'Grill'}">
    <li>{{ recipe.name }}</li>
    <li>{{ recipe.category}}</li>
    <li>{{ recipe.ingredients }}</li>
    <li>{{ recipe.instructions }}</li>
  </ul>
 </div>
</div>

控制器：

$scope.initGet = function() {
  recipesFactory.getRecipes()
  .then(function(result) {
     $scope.userRecipes = [];
     var userId = simpleStorage.get('userId');
     var recipeArr = result.data.recipes;
     for (var i = 0; i < recipeArr.length; i++) {
        var obj = recipeArr[i];
        if (obj.user_id === userId) {
             console.log("this is ", obj)
             $scope.userRecipes.push(obj)
         }
       }
     }, function(data, status, headers, config) {
          console.log("Error getting user recipes from the api");
          alert("Error getting user recipes from the api");
   });
};

$scope.activeTab = 0;
$scope.setActiveTab = function(tabToSet) {
  $scope.activeTab = tabToSet;
  $scope.initGet();
};

厂：

(function recipesFactoryIIFE(){

       var recipesFactory = function($http){
            var recipesAPI = {};

            recipesAPI.getRecipes = function(){
              return $http.get('http://localhost:3000/recipes');
            };

            return recipesAPI;
        };

  recipesFactory.$inject = ['$http'];

 angular.module('recipesApp').factory('recipesFactory', recipesFactory);
 })();

控制台：here和hereAgain

Angular：POST后获取视图并获取GET

0 个答案: