javascript - 为什么这两个更新没有反射(reflect)在 View 中？

Question

我试图了解如何通过 Controller 正确操作属性。以下代码在四秒内执行六次更新。更新二和三未反射(reflect)在 View 中。这是为什么？我需要做什么才能让这些类型的更新影响 View ？

HTML

<div ng-controller="Controller"> 
    myValue: <span ng-bind="myValue"></span>
</div>

Javascript

var app = angular.module('myApp', []);

app.controller('Controller',  function ($scope, $interval) {
    $scope.myValue = "first";
    console.log($scope.myValue);

    setTimeout(function() { 
        $scope.myValue = "second";  // never updates
        console.log($scope.myValue);
        $scope.$emit("my-event", "third"); // never updates
        console.log($scope.myValue);
        $interval(function() {
            $scope.$emit('my-event', "fourth");
        }, 1000, 1);
    }, 1000);

    $interval(function() {
        $scope.myValue = "fifth";
        console.log($scope.myValue);
        $interval(function() {        
            $scope.$emit("my-event", "sixth");
        }, 1000, 1);
    }, 3000, 1);

    $scope.$on('my-event', function (event, arg) {
        $scope.myValue = arg;
        console.log(arg);
    });
});

JSFiddle

Answer 1

使用 $timeout 而不是 setTimeout 来选择加入摘要周期。 second 将不会显示，因为摘要循环的轮次会覆盖 myValue 的值。

更新的 fiddle :https://jsfiddle.net/d9gbpddy/4/