ng-repeat中的ng-if不起作用。

28 浏览
0 Comments

ng-repeat中的ng-if不起作用。

我有一个在HTML中用Angular填充的代码片段：


    

        Id
        描述
        产品千克
        索引
    

        
                   
                {{ x.codigo }}
                {{ x.desc }}
                {{ x.prod_24_h_kg }}
                {{ x.index }}

到目前为止没有问题。然而，我想为每一行都设置一个ng-if，比如：

{{ x.index }}=='0'

我不想显示那一行。我已经尝试了很多组合的双引号和单引号，但没有成功。有人看到解决办法吗？

0

2 答案

0 Comments

问题描述：ng-repeat内部的ng-if无法正常工作

原因：使用{{}}是AngularJS中的表达式语法，用于绑定数据到HTML页面上。然而，在ng-repeat内部使用ng-if时，不需要使用{{}}来包裹条件表达式。

解决方法：只需直接输出条件表达式即可，不需要使用{{}}语法。例如，将x.index=='0'直接输出到HTML页面上即可实现条件判断。

示例代码如下：

以上就是解决ng-if inside ng-repeat无法工作的原因和解决方法。希望能对你理解和解决类似问题有所帮助。

0
0 Comments

ng-if inside ng-repeat won't work的问题出现的原因是ng-if指令内部不需要使用插值表达式{{}}，它直接接受一个表达式，该表达式将针对当前作用域进行评估。解决方法可以是使用过滤器来实现相同的功能，也可以在控制器内部进行过滤以提高性能。

具体解决方法如下：

1. 使用过滤器：

ng-repeat="x in maq | filter: {index: 0} as filterdMaq"

2. 在控制器内部进行过滤：

$http.get('data.json').then(function(response){
    $scope.dataCopy = response.data; //this is original copy of an maq.
    //filtered maq
    $scope.maq = $filter('filter')(angular.copy($scope.dataCopy), { index: 0}, true);
});

如果索引值将会改变，那么你还需要在滑动事件中执行过滤操作。可以通过调用一个函数来实现，例如：

确保在函数中对本地副本maq进行过滤，不要再次向服务器请求maq数据。

在加载json时实现过滤器时可能会遇到问题，此时需要确保在控制器函数中添加$filter依赖。

如果索引值从0到9999变化，如果只想要精确匹配，可以在滑块元素上添加step="10"属性，这将在滑块上添加10个点的间隔。在ionic中可能有step属性，具体需要查看ionic文档。

如果想要实现精确匹配，可以在过滤器的最后添加true参数，例如：

$scope.maq = $filter('filter')(angular.copy($scope.dataCopy), { index:maquina }, true);

通过以上方法，可以解决ng-if inside ng-repeat won't work的问题，并实现动态的过滤功能。

0