Question

是否有更好的方法从子数组中填充此选择下拉列表赢取我的json结果？以下不起作用，虽然它看起来格式正确给我。有任何想法吗？我有一个指令，可以在angularui手风琴中动态构建一个表单。下面这段代码查看类型是否为下拉列表，然后获取集合结果并将值/文本放在选择下拉列表中。 DDLValue是一个json数组，带有我需要的下拉数据。我知道有一种更清洁的方式购买我是Angular的新手。请帮忙。感谢

我在PLNKR上举了一个例子 http://plnkr.co/edit/R4auh433JG1GuiYppExm?p=preview

app.directive('ngFormfield', function () {
        return {
 link: function (scope, element, attrs) {               
    if (scope.record.Type == 'Dropdown') {
                element.html('<select class="btn btn-default dropdown" ng-model=' + scope.record.DDLValue.value + ' ng-options="obj.value as obj.text for obj in ' + scope.record.DDLValue + '"></select>');
    }
}

JSON

records:[{
         {
           RecordId 91,
           Type:"Dropdown',
            "Label": "Favoritebook",
            "DDLValue": "[{ 'value': '1', 'text': 'HarryPotter' }, 
                          { 'value': '2', 'text': 'StarGate' }]"
        }]

Answer 1

您必须将元素重新编译为DOM。在将新元素集成回Angular的应用程序之前，Angular不知道加载到页面中的新元素。 Plnkr中的示例http://plnkr.co/edit/R4auh433JG1GuiYppExm?p=preview

 app.directive('ngFormfield', function ($compile) {
            return {
                link: function (scope, element, attrs) {

                    if (scope.record.Type == 'Label') {

                        element.html('<label type="label" ng-model="record.DDLValue.value"/>' + scope.record.Label + '</label>');

                    }
                    else if (scope.record.Type == 'Text') {
                        element.html('<td colspan="8">'+scope.record.Label + ': <input type="text" name="fname"></td>');
                    }
                    else if (scope.record.Type == 'Dropdown') {
                        element.html('<td colspan="8"><select class="btn btn-default dropdown" ng-model=record.DDLValue.value ng-options="obj.value as obj.text for obj in record.DDLValue"></select></td>');
                    }

              fix--->    $compile(element.contents())(scope);
                }
            }
        });

指令内的Angular DropDown

1 个答案: