angularJs - ng使用自定义ID重复

时间:2015-04-17 10:18:27

标签: javascript html angularjs

编辑:

所以,在弄乱了代码并遵循每个人的建议之后,我发现,确实,id -does-工作,但其他一些人阻止它。

这是整行代码,现在:问题出在哪里?

<tr id="{{item.id}}" 
    ng-mouseover="hovering(item.id)" 
    ng-mouseleave="leaving(item.id)"  
    ng-show="showRow(item)" 
    ng-repeat="item in elements| limitTo: limiter"  
    data-id="{{item.id}}" 
    data-parent="{{item.parent}}">

HTML:

<table>
    <tr ng-repeat="item in users| limitTo: limiter" id="{{item.id}}">
        <td>{{item.name}}</td>
        <td>{{item.email}}</td>
    </tr>
</table>

数据:

$scope.users = [
    { id: 1, name: "user", email : ""},
    { id: 2, name: "anotherUser", email: ""}];

问题:

ID保持"{{item.id}}"并且未被转换为例如:&#34; 1&#34;。我也试过了ng-attr-id,但它也没有用。

为什么ID "transformed"不应该是什么?

更进一步地解决问题:如果我data-id="{{item.id}},它就可以工作。

2 个答案:

答案 0 :(得分:4)

一切似乎都有效

angular.module('app', [])
  .controller('ctrl', ["$scope",
    function($scope) {
      $scope.limiter = 4;
      $scope.users = [{
        id: 1,
        name: 'n1'
      }, {
        id: 2,
        name: 'n2'
      }, {
        id: 3,
        name: 'n3'
      }, {
        id: 4,
        name: 'n4'
      }, {
        id: 5,
        name: 'n5'
      }, {
        id: 6,
        name: 'n6'
      }];
    }
  ]);
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<table ng-app="app" ng-controller="ctrl">
  <tr ng-repeat="item in users| limitTo: limiter" id="{{item.id}}">
    <td>Id - {{item.id}}</td>
    <td>Name - {{item.name}}</td>
  </tr>
</table>

答案 1 :(得分:3)

我以前的答案很差,但有人提出投票。洛尔。

好吧,最后我得到了这个问题。

您需要将var users = [...]更改为$scope.users=[...];

更新

  • 您是否在html端指定了controllerng-app

  • 尝试在控制器中使用$scope.$apply()

    $scope.users = [ { id: 1, name: "user", email : ""}, { id: 2, name: "anotherUser", email: ""}]; $scope.$apply();