AngularJS: Schleife durch JSON und übergebe Werte an ng-Modell

Ich habe ein JSON-Objekt und ich muss durch die JSON Schleife und den Wert für das Modell anzeigen. Die Schlüssel des JSON sind identisch mit den ng-Modellwerten. Ich war in der Lage, den Schlüssel und die Werte zu bekommen. Ich muss es nur an die Eingänge übergeben.AngularJS: Schleife durch JSON und übergebe Werte an ng-Modell

unten ist mein Code.

controller.js

var supplierStorage = {"key1":"value1", "key2":"value2", "key3":"value3"}; 

for (var i = 0; i <= Object.keys(supplierStorage).length-1; i++) { 
    $scope.Object.keys(supplierStorage)[i] = supplierStorage.Object.keys(supplierStorage)[i]; 
}

HTML

<input ng-model="key1"> 

<input ng-model="key2"> 

<input ng-model="key3">

Dank.

Quelle

2016-12-20 Kim Carlo

warum Sie scope.Object.keys' tun '$ sind? –

Hallo @Daniel_L .. Ich bin neu zu eckig und noch lernen Javascript .. :) –

Ich glaube, Sie nicht alle Elemente Umfang Element mit einer for Schleife zuordnen müssen. Versuchen Sie folgendes:

Eckig:

var supplierStorage = {"key1":"value1", "key2":"value2", "key3":"value3"}; 
$scope.supplierStorage = supplierStorage;

HTML:

<input ng-model="supplierStorage.key1"> 

<input ng-model="supplierStorage.key2"> 

<input ng-model="supplierStorage.key3">

Quelle

2016-12-20 06:10:48 zainul

Ich hätte nie gedacht, es wäre so einfach! Danke Kumpel! :) –

Gerne helfen :) – zainul

dies versuchen,

var supplierStorage = {"key1":"value1", "key2":"value2", "key3":"value3"}; 

for (var p in supplierStorage) { 
    if(supplierStorage.hasOwnProperty(p)) { 
     $scope[supplierStorage[p]] = supplierStorage[p]; 
    } 
    }

Quelle

2016-12-20 06:08:18 azad

Einfach Schlüssel Klon Rahmen

var supplierStorage = {"key1":"value1", "key2":"value2", "key3":"value3"}; 

for(p in supplierStorage) { 
    $scope[p] = supplierStorage[p]; 
}

Quelle

2016-12-20 06:13:37

Sie können dies erreichen, mit Schlüssel, Wertmethode ng-Repeat wie unter

<!DOCTYPE html> 
 
<html ng-app="plunker"> 
 

 
    <head> 
 
    <meta charset="utf-8" /> 
 
    <title>AngularJS Plunker</title> 
 
    <script>document.write('<base href="' + document.location + '" />');</script> 
 
    <link rel="stylesheet" href="style.css" /> 
 
    <script data-require="[email protected]" src="https://code.angularjs.org/1.4.12/angular.js" data-semver="1.4.9"></script> 
 
    <script src="app.js"></script> 
 
    </head> 
 

 
    <body ng-controller="MainCtrl"> 
 
    <div ng-repeat="(k,v) in supplierStorage"> 
 
     <input type="text" ng-model="v"/> 
 
    </div> 
 
    </body> 
 
<script> 
 
    var app = angular.module('plunker', []); 
 

 
app.controller('MainCtrl', function($scope) { 
 
    
 
    $scope.supplierStorage = {"key1":"value1", "key2":"value2", "key3":"value3"}; 
 
}); 
 

 
</script> 
 
</html>

hier binden i die Werte eingeben, wenn Sie Schlüssel binden möchten ersetzen v mit k

Quelle

2016-12-20 06:16:20

bereits. Schleifen sind nicht notwendig.

<!DOCTYPE html> 
 
<html> 
 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> 
 

 
<body> 
 

 
    <script> 
 
     var app = angular.module("MyTestApp", []); 
 
     app.controller("myCtrl", function ($scope) { 
 
      var supplierStorage = { 
 
       "key1": "value1", 
 
       "key2": "value2", 
 
       "key3": "value3" 
 
      }; 
 

 
      $scope.DataArray = supplierStorage; 
 
     }); 
 
    </script> 
 

 
    <div ng-app="MyTestApp" ng-controller="myCtrl"> 
 
      <input ng-model="DataArray.key1"/> 
 
      <input ng-model="DataArray.key2"/> 
 
      <input ng-model="DataArray.key3"/> 
 
    </div> 
 

 

 
</body> 
 

 
</html>

Quelle

2016-12-20 06:17:08 Nitheesh

<!DOCTYPE html> 
    <html> 
    <head> 
     <meta charset="utf-8"> 
     <meta name="viewport" content="width=device-width"> 
     <title>JS Bin</title> 
    </head> 
    <body> 
    <script src="https://rawgit.com/angular/bower-angular/master/angular.min.js"></script> 
    <div ng-app="myApp" ng-controller="myCtrl"> 
     <div ng-repeat="(key, value) in supplierStorage"> 
     {{key}} : <input type="text" ng-model="data[key]"/> {{data[key]}} 
     </div> 
    </div> 
    </body> 

    <script type="text/javascript"> 
     var app = angular.module('myApp', []); 
     app.controller('myCtrl', function($scope) { 
      $scope.supplierStorage = {"key1":"value1", "key2":"value2",    "key3":"value3"}; 
}); 


    </script> 
    </html>

Quelle

2016-12-20 06:20:32 ishwar

AngularJS: Schleife durch JSON und übergebe Werte an ng-Modell

Antwort

Verwandte Themen