Angular changes model asynchronously, why is it not updated to view?

  node.js, question

The code is as follows. Why does the text of the page not change after 2 secondsworld

<body ng-app="myApp">
 <div ng-controller="asyncCtrl">
 <input type="text" ng-model="name">
 <span>{{name}}</span>
 </div>
 <script src="../../bower_components/angular/angular.js"></script>
 <script type="text/javascript">
 var myApp = angular.module('myApp',[]);
 myApp.controller('asyncCtrl',function($scope,$http){
 $scope.name = "hello";
 setTimeout(function(){
 $scope.name = "world";
 },200);
 })
 </script>
 </body>

In addition, through$httpHow to assign the background data obtained tomodel, and then automatically update the view?

PS: Well, actually both problems are one problem. .

SetTimeout breaks away from ng’s supervision and is temporary. Therefore, the bottom layer of ng will not automatically perform dirty detection to update the view. It is required to manually $scope.$apply () to force dirty detection to refresh the view, or use the method described above to delay the execution with the $timeout of “officially recognized root is thriving” encapsulated by ng.