Question

我正在使用帮助ng-repeat在页面上呈现表单，此表单的数据来自请求。在这个数据中，我有嵌套的数组 - 类别。在这个数组中定义了id和这个id的列表，我可以在我的表单中看到。从另一个请求我得到另一个数组，其中定义了ids的名称。如何从一个变量中将键值分配给显示在名称页面列表而不是id列表上的另一个变量的键值

我的问题是plunker。我感谢任何帮助，提前谢谢。

我的表单的HTML

 <form style="padding: 15px" ng-submit="submitForm(rowData)">
            <div class="form-group row">
            <div ng-repeat="(key, value) in rowData">
            <div  ng-if="key | id">
                <label class="col-sm-6">{{key | makeUppercase}}</label>
                <div class=" col-sm-6">
                <input class="form-control rowValue"
                       id="rowData[key]"
                       ng-if="!isObject(value)"
                       type="text"
                       ng-model="rowData[key]"
                                                    />
               <span
                     class="form-control rowValue"
                     id="categories"
                     ng-if="isObject(value) && key == 'categories'"
                     ng-model="rowData.categories">   
                        {{rowData.categories}}
                </span>
               </div>
              </div>
             </div>
            </div>
                 <div class="pull-right">
       <button type="submit" class="btn btn-default" 
               ng-if="rowData">Save</button>
       <button type="button" class="btn btn-default" ng-if="rowData"
               ng-click="cancelForm()">Cancel</button>
             </div>
         </form>

Answer 1

我的实施很幼稚，但它显示了你想要的东西。我将此功能添加到您的控制器

  $scope.getCategoryIns = function(ids){
    var categoriesName = [];
    for (var j = 0; j < ids.length; j ++){
    id = ids[j];
   for(var i= 0; i < $scope.categories.length;i++)
   {
      if ( $scope.categories[i].id == id){
        categoriesName.push($scope.categories[i].name);
      }
   }
 }

  var str = categoriesName.join(', ');
  return str;
}

并在HTML中使用此功能如下

<span class="form-control rowValue"  id="categories" ng-if="isObject(value) && key == 'categories'" ng-model="rowData.categories">
                       {{getCategoryIns(rowData.categories)}}</span>

plnkr here

Answer 2

您可以在控制器中创建一个新方法，将$scope.rowData.categories中的数字映射到$scope.categories.id并返回相应类别名称的值：

$scope.getCategoryName = function (categoriesArr) {
    return categoriesArr.map(function(curr) {
        return $scope.categories.filter(function(el){
            return el.id === curr; //filter out the appropriate category by id
        })[0].name; //select the item and grab its name property
    })
}

并更新您的HTML以使用新方法：

<span>
    class="form-control rowValue"
    id="categories"
    ng-if="isObject(value) && key == 'categories'"
    ng-model="rowData.categories">
     {{getCategoryName(rowData.categories)}}
</span>

如何将一个变量中的键分配给另一个变量中的值，角度

2 个答案: