Question

我正在研究用户从下拉列表中选择项目的代码，并根据所选项目显示UI元素。示例：如果选择item1，则会有2个文本框，1个textarea和一个复选框。 item2将有1个文本框。等。

所以，我目前有一个函数，我根据所选的项目添加html元素。我得到一个JSON文件，其中包含项目列表以及该项目所需的UI元素。当用户选择一个项目时，我从该JSON文件中获取所需信息，并调用以下代码：

  $scope.myHTML = "";
  var aForm = (angular.element(document.getElementById('appType')));
  aForm.html(''); 
  dropdown.forEach(function(viewItem, index){
    if(viewItem.control_type === "TextBox"){
     $scope.myHTML += '<label class="label">'+ viewItem.label +'</label>'+
     '<input type="text" ng-model = "item.value'+index + '" placeholder = "'+ viewItem.text +'">';
    }
    if(viewItem.control_type === "TextArea"){
     $scope.myHTML += '<label class="label">'+ viewItem.label +'</label>'+
     '<textarea type="text" rows="4" ng-model = "tests.value'+index + '" ></textarea>'';
    }
  }
  aForm.append($scope.myHTML);
  $compile(aForm)($scope);

因此ng-model将为每个元素提供item.value0，item.value1等。我使用$ compile将html视图添加到UI。

问题是我可以在控制器中获取值，但我无法从控制器中设置这些值。

   dropdown.forEach(function(viewItem, index){
     $scope.tests['value'+index] = "SomePresetValue";    //Does not update value on HTML
     });

不为HTML元素设置值。我在搜索替代解决方案后尝试了以下方法，但没有成功。

$scope.$apply(function(){
                dropdown.forEach(function(viewItem, index){
                            $scope.item['value'+index] = viewItem.value;
                        });
            });

AngularJS - 无法从控制器设置动态创建的ngmodel

0 个答案: