AngularJS：Switch模型值不会影响UI

Question

我已经在link:方法中创建了一个指令并启动了一些模型，然后在模板的<a>标记上绑定了一个点击事件。范围模型将其值相互切换。

当我在控制台中看到模型值时，它似乎工作正常。但不反映UI。

这是我的小提琴：http://jsfiddle.net/gp32g7sr/7/

Answer 1

需要在$apply范围内运行摘要周期。从事件中更改范围变量不会运行角度摘要循环，我们需要手动运行它。

链接Fn

    link: function (scope, element, attrs) {
        scope.activeContinent = 'Asia';
        scope.altContinent = 'America';
        element.find('a').on('click', function (e) {
            e.preventDefault();
            var x = scope.altContinent;
            scope.altContinent = scope.activeContinent;
            scope.activeContinent = x;
            document.querySelector('#log')
                .innerHTML = scope.activeContinent + '  ' + scope.altContinent;
            //$compile(document.querySelector('#log'))(scope);
            scope.$apply();
        });
    }

Working Fiddle