更新$範圍，正在進行摘要

這已被詢問並回答了很多次。但是，嘗試了很多東西之後，我仍然有這個問題。

我在Angular中有一個搜索按鈕的單頁面。參數越來越低谷，並像這樣登錄console.log("searched: " + search.term);

然後我使用這個術語來查詢我的數據庫使用REST，結果回來很好。都好！

現在，我想用這些新結果更新$ scope數據。我很努力地通過添加$scope.$apply()並使用$timeout和使用$digest。

這一切都使我的錯誤：$消化正在進行中

然後我用$範圍$手錶，這樣的作品，我使用警報測試，但數據永遠不會改變我的瀏覽器。

'use strict'; 

// Declare app level module which depends on views, and components 
angular.module('Grep GUI', [ 
    'ngRoute', 
    'myApp.view1', 
    'myApp.view2', 
    'myApp.version' 
]). 
config(['$locationProvider', '$routeProvider', function($locationProvider, $routeProvider) { 
    $locationProvider.hashPrefix('!'); 

    $routeProvider.otherwise({redirectTo: '/view1'}); 
}]). 
controller('DataBeest', function($scope, $http) { 

    $http.get('http://localhost:8529/_db/grep/grepdata/huizen'). 
      then(function(response) { 
       $scope.greeting = response.data; 
      }); 

    $scope.search = function(search) { 
     console.log("searched: " + search.term); 

     $http.get('http://localhost:8529/_db/grep/zoek/zoek/' + search.term). 
     then(function(response) { 
        $scope.greeting = response.data; 
        $scope.$digest() 
     }); 
    } 
});

的index.html

<!DOCTYPE html> 
<!--[if lt IE 7]>  <html lang="en" ng-app="myApp" class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]--> 
<!--[if IE 7]>   <html lang="en" ng-app="myApp" class="no-js lt-ie9 lt-ie8"> <![endif]--> 
<!--[if IE 8]>   <html lang="en" ng-app="myApp" class="no-js lt-ie9"> <![endif]--> 
<!--[if gt IE 8]><!--> <html lang="en" ng-app="grep GUI" class="no-js"> <!--<![endif]--> 
<head> 
    <meta charset="utf-8"> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
    <title>My AngularJS App</title> 
    <meta name="description" content=""> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <link rel="stylesheet" href="bower_components/html5-boilerplate/dist/css/normalize.css"> 
    <link rel="stylesheet" href="bower_components/html5-boilerplate/dist/css/main.css"> 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
    <link rel="stylesheet" href="app.css"> 
    <script src="bower_components/html5-boilerplate/dist/js/vendor/modernizr-2.8.3.min.js"></script> 
</head> 
<body> 

    <div class="navbar navbar-inverse navbar-static-top" role="navigation"> 

     <div class="navbar-header"> 
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse"> 
      <span class="sr-only">Toggle navigation</span> 
      <span class="icon-bar"></span> 
      <span class="icon-bar"></span> 
      <span class="icon-bar"></span> 
      </button> 
      <a class="navbar-brand" rel="home" href="/" title="grep Crawler">/Grand Theft grep</a> 
     </div> 

     <div class="collapse navbar-collapse navbar-ex1-collapse"> 

      <ul class="nav navbar-nav"> 
       <li><a href="/alle_data">/alle_data</a></li> 
       <li><a href="/alle_plaatjes">/alle_plaatjes</a></li> 
       <li><a href="/nog_wat">/nog_wat</a></li> 
      </ul> 

      <div class="col-sm-3 col-md-3 pull-right" ng-controller="DataBeest"> 
      <form class="navbar-form" role="search"> 
      <div class="input-group"> 
       <input type="text" class="form-control" placeholder="Zoek" name="srch-term" id="srch-term" ng-model="search.term"> 
       <div class="input-group-btn"> 
        <button class="btn btn-default" type="submit" ng-click="search(search)"><i class="glyphicon glyphicon-search"></i></button> 
       </div> 
      </div> 
      </form> 
      </div> 

     </div> 

    </div> 

<div class="container" ng-controller="DataBeest"> 
    {{ greeting }} 
</div> 

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
    <script src="bower_components/angular/angular.js"></script> 
    <script src="bower_components/angular-route/angular-route.js"></script> 
    <script src="app.js"></script> 
    <script src="components/version/version.js"></script> 
    <script src="components/version/version-directive.js"></script> 
    <script src="components/version/interpolate-filter.js"></script> 
</body> 
</html>

來源

2017-04-11 Thijs

您使用的是原生使用'$ http'服務的角度AJAX，那麼爲什麼你需要'$ scope。$ digest（）'？ –

我認爲你可以刪除$ scope。$ digest（），你應該可以看到在 – CrazyMac

'$ scope。$ apply'或'$ scope。$ digest'下的修改後的值在這裏不需要。如果您在沒有角度知識的情況下更新數據，您只需要這些。看起來你的問題更多的是在你的搜索中的迴應;你有沒有登錄它來驗證它有你期望的數據？ – Claies

確定發現了它，我已經重新使用的控制器在視圖中，這使得它所有靠不住..

來源

2017-04-14 08:51:28 Thijs

更新$範圍，正在進行摘要

回答

相關問題