Question

我对角度js相当新。我的控制器中有两个不同的范围数据（$ scope.itemdata＆amp; $ scope.skudata，两者都在plucker中简化）。两者都保证具有任何键的相同结构。我有一个项目数据的嵌套ng-repeat，我想在每个ng-repeat中存储/保持键的跟踪，这样我就可以使用path变量来获取skudata的值。问题：HTML中的{{path}}表达式无法解析为正确的键值。查看控制台日志，按正确顺序添加和删除密钥。我不确定我哪里出错了。

这是plucker：http://plnkr.co/edit/0q8tZ9JLsGdfR03YbpYB?p=info

HTML Code:<body ng-controller="MainCtrl">
<p>Hello</p>

<script type="text/ng-template" id="field_renderer.html">

<div ng-init="addkeyToPath(key)"></div>
  {{key}} 
  {{value}}
  <!--output should be skudata.value but instead its skudata-->
  {{path}}

<div ng-init="removeKeyFromPath(key)"></div> 
 {{path}}


</script>
<div>
  <div ng-repeat="(key ,value) in itemData" ng-include="'field_renderer.html'"></div>
</div>

控制器代码：

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

app.controller('MainCtrl', function($scope) {
  $scope.path = 'skudata';

  $scope.isThisAnObject = function(input) {
    return angular.isObject(input) ? true : false;
  }
  $scope.addkeyToPath = function(input) {
    console.log("Adding");
    console.log($scope.path);
    $scope.path =  $scope.path + "." + input;
    console.log($scope.path);
   };

   $scope.removeKeyFromPath = function(input) {
     console.log("remove");
    console.log($scope.path);
    $scope.path = $scope.path.substring(0,$scope.path.lastIndexOf("."));
    console.log($scope.path);
   };

  $scope.itemData =
  { value:'item_name', 
    length:'10'

  };

  $scope.skudata =
  { value:'sku_name', 
    length:'20'

  };


});

Answer 1

问题在于，当您真正想要显示项目本身的路径变量时，您正在使用$scope路径变量。进行一些更改以获得this working plunkr

模板：

<div ng-init="addkeyToPath(this, key)">
  {{key}}: {{value}}
  {{path}}
</div>

控制器：

$scope.addkeyToPath = function(item, input) {
  item.path = $scope.path + "." + input;
 };

$scope.itemData = { 
  value:'item_name', 
  length:'10'
};

将键存储在每个ng-repeat的变量中

1 个答案: