Angular ngForm包裹元素？

有沒有一種方法可以將輸入元素包裝到ngForm指令中？（我需要使用ngForm，這是成asp.net形式）Angular ngForm包裹元素？

angular.module('app',[]) 
 
.controller('formCtrl', function($scope){ 
 

 
    $scope.formFields; 
 
    $scope.model={ 
 
    
 
    "text": 'simple text', 
 
    "number": 1, 
 
    "textarea": 'lsadij isdajo\n dasjojoisajijsdaojsdaio jioasdj' 
 
    
 
    }; 
 
    
 
    $scope.getNgFormInputs = function(e){ 
 
    
 
     $scope.formInfo = $scope.myFrm 
 
     $scope.formFields = angular.noop //??? is it possible to get wrapped inputs? 
 
    
 
    } 
 

 

 
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.8/angular.min.js"></script> 
 

 
<div ng-app="app"> 
 
    <div ng-controller="formCtrl"> 
 
    
 
    <div ng-bind="model.text"></div> 
 
    <div ng-bind="model.number"></div> 
 
    <pre ng-bind="model.textarea"></pre> 
 
    
 
    <ng-form name='myFrm'> 
 
     
 
     <input type="text" ng-model="model.text"><br> 
 
     
 
     <input type="text" ng-model="model.number"><br> 
 
     
 
     <textarea ng-model="model.textarea"></textarea><br> 
 
     
 
     <button ng-click="getNgFormInputs($event)" role="submit">Save</button> 
 
     
 
     </ng-form> 
 

 

 
    {{formInfo}}<hr> 
 
    {{formFields}} 
 
    </div> 
 
</div>

韓國社交協會

來源

2016-04-28 egidiocs

什麼是你想實現的，在更高層次上？這聽起來像是一個XY問題。 –

是的，這可能是一個XY問題。這段代碼只是一個概念。在我的真實世界中，（A）$ scope.model是一個更大的對象，我正在更新它的一部分。（B）時間不多了，所以我硬編碼了表單元素，而不是使用獲取模型[prop]數組屬性的指令來編譯它們（它可以解決我的問題）。（C）因此，爲了節省時間，我不想一次又一次地寫入已經包裝到我的ngForm中的[{prop：val}]。我也不想使用jQuery。無代碼，永遠。這是否澄清？ Tks「 – egidiocs

@JBNizet，你能否詳述一下你的想法？有些場景Syed的回答不適用Tks – egidiocs

是的，它有，如果我理解正確的話。僅供參考請參閱本 https://scotch.io/tutorials/building-dynamic-angular-forms-with-ngrepeat-and-ngform

更具體：要快速：https://scotch.io/tutorials/building-dynamic-angular-forms-with-ngrepeat-and-ngform#validation-using-ngform

來源

2016-04-28 22:48:22

tks，input元素中缺少的attr屬性讓我不想實現它簡單的代碼行，我很好去：$ scope.formFields = Object.keys（$ scope.myNgForm）.filter（x =>（！/^\ $ /。test（x））） – egidiocs

感謝賽義德，參考解決我的問題。

我建議人們在thw答案中閱讀我自己的評論。

angular.module('app',[]) 
 
.controller('formCtrl', function($scope){ 
 

 
    $scope.formFields; 
 
    $scope.model={ 
 
    
 
    "text": 'simple text', 
 
    "number": 1, 
 
    "textarea": 'lsadij isdajo\n dasjojoisa \n jijsdaojsdaio jioasdj' 
 
    
 
    }; 
 
    
 
    $scope.formFieldsAndValues = {} 
 
    
 
    $scope.getNgFormInputs = function(e){ 
 
    
 
     
 
     $scope.formFields = keys = Object.keys($scope.myFrm).filter(x => (!/^\$/.test(x))) 
 
     keys.forEach(x=> $scope.formFieldsAndValues[x] = $scope.myFrm[x].$viewValue) 
 
    
 
    } 
 

 

 
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.8/angular.min.js"></script> 
 

 
<div ng-app="app"> 
 
    <div ng-controller="formCtrl"> 
 
    
 
    <div ng-bind="model.text"></div> 
 
    <div ng-bind="model.number"></div> 
 
    <pre ng-bind="model.textarea"></pre> 
 
    
 
    <ng-form name='myFrm'> 
 
     
 
     <input type="text" ng-model="model.text" name="text"><br> 
 
     
 
     <input type="text" ng-model="model.number" name="number"><br> 
 
     
 
     <textarea type="text" ng-model="model.textarea" name="textarea"></textarea><br> 
 
     
 
     <button ng-click="getNgFormInputs($event)" role="submit">Save</button> 
 
     
 
     </ng-form> 
 
<hr> 
 
form fields: 
 
    {{formFields}} 
 
    <hr> 
 
field,value pairs: 
 
    {{formFieldsAndValues}} 
 
    </div> 
 
</div>

來源

2016-04-28 23:23:32 egidiocs

Angular ngForm包裹元素？

回答

相關問題