AngularJS將模型應用到動態表單元素

我試圖將模型數據從控制器綁定到指令模板。指令模板基於來自控制器的表單對象重複表單輸入類型。AngularJS將模型應用到動態表單元素

目標是在多個位置使用此指令，並將適當的模型綁定到表單，而不是每次創建表單。

我已經找到了使用跨越和隔離範圍的示例，但是，我遇到的每個示例似乎都具有硬編碼的模型屬性。

這是一個jsfiddle，希望能夠更好地解釋我想要實現的目標。

app.controller('FormCtrl',function($scope) { 
    $scope.form = [ 
     {label:'First',type:'text',name:'first_name'}, 
     {label:'Last',type:'text',name:'last_name'} 
    ]; 

    $scope.person = {first_name:'Jimmy',last_name:'Page'}; 
}); 

app.directive('formelements',function() { 
    return { 
     restrict: 'E', 
     scope:false, 
     template: '<div ng-repeat="elements in form"><input type="text" ng-model="field.name"></div>' 
    } 
});

感謝您的幫助。

來源

2014-06-25 Rob

您可以使用以下作爲模板：

template: '<div ng-repeat="element in form">' + 
    '<input type="text" ng-model="person[element.name]"></div>'

小提琴：http://jsfiddle.net/g5Mzs/

本質上name字段被用來定義person對象中的索引。

來源

2014-06-25 14:23:36

感謝您的幫助。我想我可以使用form_model作爲我的對象在每次需要時應用到表單上： http://jsfiddle.net/N9rSa/ – Rob

AngularJS將模型應用到動態表單元素

回答

相關問題