Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/466.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181

Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/html/69.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 多个指令显示相同的数据(范围),以及如何停止此操作。_Javascript_Html_Angularjs_Angularjs Directive_Angularjs Scope - Fatal编程技术网

Javascript 多个指令显示相同的数据(范围),以及如何停止此操作。

Javascript 多个指令显示相同的数据(范围),以及如何停止此操作。,javascript,html,angularjs,angularjs-directive,angularjs-scope,Javascript,Html,Angularjs,Angularjs Directive,Angularjs Scope,我有一个ng repeat,它将重复执行$http调用的指令。然后它将显示返回的数据,但我似乎无法阻止指令彼此更新。以下是想法: 主要 我的指令模板 ...{{result.count}}.. 这将返回仅在范围更改时更新的模板 .directive('myDirective', function($parse, $http) { return { restrict: 'E', scope: { item : '=' }, replace: tru

我有一个ng repeat,它将重复执行$http调用的指令。然后它将显示返回的数据,但我似乎无法阻止指令彼此更新。以下是想法:

主要

我的指令模板

...{{result.count}}..
这将返回仅在范围更改时更新的模板

.directive('myDirective', function($parse, $http) {
return {
    restrict: 'E',
    scope: {
        item : '='
    },
    replace: true,
    transclude: false,
    templateUrl: '...template...',
    controller: function($scope) {
$http.get(item.url).success(function(data) {
    result.count=data.count;

})
}
有时,通过ng重复,结果.计数是相同的。我想知道我是否做错了什么,或者有没有办法解决这个问题


注意:我已经检查了http调用的结果,它们总是不同的。也没有语法错误

在指令中使用
链接
,并隔离您的范围,如:

.directive('myDirective', function($parse, $http) {
    return {
        restrict: 'E',
        scope: true,
        replace: true,
        transclude: false,
        templateUrl: '...template...',
        link: function (scope, element, attrs) {
            $http.get(attrs.item).success(function(data) {
                scope.result.count=data.count;
            }),
        }
    }
})
在上阅读有关链接和隔离作用域的更多信息



就像有人在评论中说的那样,使用这并不是最好的方式,因为你对每一个项目都做一个GET,所以如果你有10个项目,你会做10次GET如果您可以在控制器上执行get 1次并获取所需的所有数据。

@ajmajma您能给我发送一个链接到一个好的示例吗?看起来您正在对repeat中的每个单一项启动http调用。这不是一个很好的方法。你是被迫这样做的吗?@Ajmajma悲哀地说,是的。我必须根据日期url显示数据,该url返回我无法过滤的特定数据。我的选择是有一个url查询,然后我可以过滤下来,但这是不可能的:(仅添加到最后一条注释中-如果可以,最好在一次调用中,而不是多次单独调用中,您应该在将项目放入repeat之前执行http调用。然后您可以挂接父范围中的更改事件并控制那里的数据,这样,您传递到的子项和绑定到该指令的子项将始终保持不变。)保持一致。如果您有任何意见,我建议设置一个后端以使用一个调用。您在这里对重复和单独的html调用所做的是一个很大的不允许。我明白了,所以在您看来,在指令中执行http调用总是不好的?作用域:{item:'='},与attrs.item不同?如果您使用“=”是双向数据绑定,那么您将更改所有作用域。这是关于作用域的一个很好的解释谢谢,我相信您给出了最好的答案。关于绑定,您是对的,一些原因所有作用域都会更新。:)
.directive('myDirective', function($parse, $http) {
    return {
        restrict: 'E',
        scope: true,
        replace: true,
        transclude: false,
        templateUrl: '...template...',
        link: function (scope, element, attrs) {
            $http.get(attrs.item).success(function(data) {
                scope.result.count=data.count;
            }),
        }
    }
})