Question

我正在使用AngularJS中的一些指令，这是代码：

app.directive('country', ['$http', function($http) {
        return {
            restrict: "C",
            link: function(scope, element, attrs) {
                $http.get(Routing.generate('countries')).success(function(data) {
                    if (data.message) {
                        scope.message = data.message;
                    } else {
                        scope.countries = data.entities;
                    }
                }).error(function(data, status, headers, config) {
                    if (status == '500') {
                        scope.message = "No hay conexión con el servidor.";
                    }
                });
            }
        };
    }]);

app.directive('state', ['$http', '$parse', function($http, $parse) {
    return {
        restrict: "C",
        scope: {
          country: "="  
        },
        link: function(scope, element, attrs) {
            scope.$watch(attrs.trigger, function() {
                console.log("I'm in");
                if ($parse(attrs.trigger) !== undefined) {
                    states = $parse(attrs.statetrigger)(scope);
                    states = {};

                    $http.get(Routing.generate('states') + '/' + $parse('scope.' + attrs.trigger).iso_country).success(function(data) {
                        if (data.message) {
                            scope.message = data.message;
                        } else {
                            scope.states = data.entities;
                        }
                    }).error(function(data, status, headers, config) {
                        if (status == '500') {
                            scope.message = "No hay conexión con el servidor.";
                        }
                    });
                }
            });
        }
    };
}]);

app.directive('city', ['$http', '$parse', function($http, $parse) {
        return {
            restrict: "C",
            link: function(scope, element, attrs) {
                scope.$watch(attrs.statetrigger, function() {
                    if ($parse('scope.' + attrs.countrytrigger) !== undefined && $parse('scope.' + attrs.statetrigger) !== undefined) {
                        $http.get(Routing.generate('cities') + '/' + $parse('scope.' + attrs.countrytrigger).iso_country + '/' + $parse('scope.' + attrs.statetrigger).state).success(function(data) {
                            if (data.message) {
                                scope.message = data.message;
                            } else {
                                scope.cities = data.entities;
                            }
                        }).error(function(data, status, headers, config) {
                            if (status == '500') {
                                scope.message = "No hay conexión con el servidor.";
                            }
                        });
                    }
                });
            }
        };
    }]);

由于某种原因，我不知道，任何时候页面加载两个指令都被调用，不知道为什么，能不能给我一些提示？我离开了，因为一张图片谈了几千多个字。

enter image description here

Answer 1

看到你去了解角js的执行情况！当您启动Web应用程序时，角度js会加载内存中指令和控制器等的所有引用，这些引用发生在第一次调用但未执行指令等时。

现在在html中你必须使用控制器和指令，以便angular js编译器替换自定义指令，如ng-repeat，ng-show等HTML世界未知的纯HTML代码并编写javascript代码这被称为$ watch，以便你的模型自动绑定到视图..即2路数据绑定，在一个非常基本的只是一个javascript代码，当你更新模型时会运行，差异是你没有明确地对它进行编码将会为你做到这一点。

因此，当页面加载时，将调用HTML中的任何指令，以便angular可以知道如何处理它

每次加载页面时都会调用指令，为什么？

1 个答案: