1

我正在尝试找出将数据从服务中提取到我的指令中的正确方法。由于某种原因,我的 $watch 语句在加载数据时没有被触发。

link: function(scope, element, attrs){

            scope.loadtext = testService.getJSON();

            scope.$watch(scope.loadtext, function(newValue, oldValue){

                if (newValue !== oldValue){
                    alert("watch working");
                    element.addClass("red");
                    element.html(newValue.ok);
                }
            });


        }

简单的 JSFiddle http://jsfiddle.net/jamesamuir/m85Ka/1/

但是,我不确定我是否以正确的方式接近这一点。我试图深入研究 Directives 的文档,但它似乎并没有为解决这个问题提供太多见解。

4

2 回答 2

4

我不确定你的最终目标是什么,但我认为你没有使用正确的方法。无论如何,我更新了 jsfiddle 并保留了 $watch 虽然它不需要。

问题在这里:

this.getJSON = function() {
    $http.get('http://ricardohbin.com/cors/testcors.php')
        .success(function(data) {
            $rootScope.$apply(function(){
                 alert(data);
                return data;
            });
        }).
        error(function(data, status, headers, config) {
            alert(status + " | bad");
        });
}

您与此代码中的回调return data无关,getJSON而是与回调相关联。$rootScope.$apply在这种情况下,您不能return使用回调,因为数据将像这样异步加载:

testService.getJSON(function(data) {
    scope.loadtext = data;
});

代替:

$scope.loadtext = testService.getJSON();

http://jsfiddle.net/m85Ka/10/

于 2013-05-16T22:56:02.817 回答
3

虽然 Tim Withers 的建议可以解决您的问题,但加载数据的正确方法是从视图的控制器函数或在指令自己的控制器中。

于 2013-05-16T14:47:11.510 回答