这是为什么code打破了AngularJS 1.2？ [英] Why is this code broken in AngularJS 1.2?

问题描述

Goodevening，

Goodevening,

以下code似乎工作在老版本的角度，而不是在1.2版本。我不知道这是为什么。什么发生在1.2角，就是$手表指令不被打到。它不执行。它在角1.0.1执行。

The following code seems to work in older versions of Angular, but not in the 1.2 version. I am not sure why that is. What happens in Angular 1.2, is that the $watch directive does not get hit. It does not execute. It does execute in Angular 1.0.1.

任何想法，为什么？

HTML

<fieldset validatedmarker>
    <legend>User</legend>
    <input type="text" name="name" class="form-control" ng-model="name" required>
</fieldset>

和JS的。

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

APP.directive('validatedmarker', function() {
    return {
        restrict: 'AE',
        scope: { },
        link: function(scope,e,a) {
            scope.$watch(function() {
                return scope.name;
            }, function(newValue, oldValue) {
                console.log("change detected: " + newValue)
            });
        }
    };
});

工作示例（角1.0.1）

http://jsfiddle.net/2w8xW/

非工作示例（角1.2.0）

http://jsfiddle.net/24​​P86/

谢谢！

推荐答案

最可能的原因是孤立的范围的治疗，在AngularJS改变1.2.0

The most probable reason for this is the treatment of isolated scopes, that has changed in AngularJS 1.2.0

在早期版本的一切指令元素中得到了孤立的范围，但现在里面的指令的要素得到原始父范围。所以，当你设置scope.name你在父作用域设置的值。手表是对儿童的范围。

In earlier version everything inside the directive element got the isolated scope, but now the elements inside the directive get the original parent scope. So when you are setting the value of scope.name you are setting on parent scope. The watch is on child scope.

请参阅本SO回答<一个href=\"http://stackoverflow.com/questions/19943935/angularjs-scope-difference-1-0-x-vs-1-2-x\">AngularJS适用范围差异1.0.x的VS的1.2.x 和更新日志。

See this SO answer AngularJS Scope difference 1.0.x vs 1.2.x and the changelog.

为了使您的工作，例如，你必须为你的指令模板，设置transclude：在指令定义为真

To make your example work you would have to create a template for your directive and set transclude: true in directive definition.

这篇关于这是为什么code打破了AngularJS 1.2？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！