ng-如果不使用ng-repeat

时间:2015-08-12 19:13:20

标签: angularjs angularjs-ng-repeat angularjs-ng-if

这应该是一个简单的问题,但我不明白发生了什么。 基本上我将一个对象传递给我的控制器中的函数调用,使用ng-if进行ng-repeat。 但是我的函数没有看到传递给它的参数。它说未定义。

var app = angular.module('newformController', []);

app.controller('NewFormController', ['$scope', '$log',
            function($scope, $log) {
              
     $scope.meta = {
      "GRANT": {
        "VALUE": "2",
        "DEFAULT": "1",
        "RANGE": "1:4",
        "TYPE": "INTEGER",
        "DESCRIPTION": "Some description"
      }
    };

    $scope.testing = function(x) {
        $log.debug('X is: ' + x);
        if (x == "1:4") {
          return true;
        } else {
          return false;
        }
    };
    
}]);
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
<tr ng-repeat="(param,value) in meta">
  <td>{{param}}</td>
  <td>{{value.DESCRIPTION}}</td>
  <span ng-if="testing(value.RANGE)">
                  <td><input type="text" class="form-control" value="{{value.DEFAULT}}"></td>
              </span>
</tr>

为什么控制台打印'undefine'?为什么函数会多次调用?我只有一个键,不应该只重复一次ng-repeat吗?

enter image description here

现在,如果我而不是“value.RANGE”将一些字符串传递给函数,则字符串将被正确读取/打印...

2 个答案:

答案 0 :(得分:2)

这是因为您的HTML无效 - 请查看此示例 - http://jsfiddle.net/HB7LU/16355/

我刚刚修改了你的表格代码,看起来像这样

<table>
    <tr ng-repeat="(param,value) in meta">
        <td>{{param}}</td>
        <td>{{value.DESCRIPTION}}</td>
        <td ng-if="testing(value.RANGE)">
            <input type="text" class="form-control" value="{{value.DEFAULT}}">
        </td>
    </tr>
</table>

它有效:)。

答案 1 :(得分:1)

如果你使用有效的HTML,它可以正常工作

<tr ng-repeat="(param,value) in meta">
  <td>{{param}}</td>
  <td>{{value.DESCRIPTION}}</td>

  <td ng-if="testing(value.RANGE)">
    <input type="text" class="form-control" value="{{value.DEFAULT}}">
  </td>

</tr>

<span>不是<tr>的有效子项,因此浏览器可能会将其移出表格之外,因此超出ng-repeat子范围。然后当角度运行时,它的功能在不同范围内

working version