i just began working with angular js and one of my problem can be solved with $watch,but i don't know to use it.i want to build dinamically json
i want that if user enters something in the different forms, it is added automatically to my json.example ,if i enter sylvie as givenName ,it appears on the field <<"schema:givenName:">> of my json.find below my html and the angular file
angular.module("jsonerator",[])
.controller('theController', function ($scope) {
$scope.personld = {
"@context": {
"schema": "http://schema.org/"
},
"@graph": [
{
"@id": "person",
"@type": "schema:Person",
}
]
}
var person={};
$scope.personld["@graph"][0]["schema:givenName:"]="";
$scope.personld["@graph"][0]["schema:familyName:"]="";
$scope.personld["@graph"][0]["schema:gender:"]="";
$scope.personld["@graph"][0]["schema:nationality:"]="";
$scope.personld["@graph"][0]["schema:worksFor:"]="";
$scope.personld["@graph"][0]["schema:jobTitle:"]="";
$scope.personld["@graph"][0]["schema:url:"]="";
$scope.personld["@graph"][0]["schema:image:"]="";
$scope.$watch('person',
function theController($scope) {
$scope.update = angular.copy.persold;
}
)
})
<script src="http://ift.tt/1mQ03rn"></script>
<html lang="en" ng-app="jsonerator">
<head>
<title>JSON Form</title>
<script type="text/javascript"
</head>
<body>
<div ng-controller="theController">
<form>
<label>givenName:</label>
<input type="text" ng-model="person.givenName"/></br>
<label>familyName:</label>
<input type="text" ng-model="person.familyName"></br>
<label>Gender:</label>
<input type="text" ng-model="person.gender"/></br>
<label>Nationality:</label>
<input type="text" ng-model="person.nationality"></br>
<label>Worksfor:</label>
<input type="text" ng-model="person.job"></br>
<label>JobTitle:</label>
<input type="text" ng-model="person.poste"></br>
<label>Url:</label>
<input type="text" ng-model="person.url"></br>
<label>Image:</label>
<input type="text" ng-model="person.image"></br>
</form></br>
<p>{{personld}}</p>
</div>
</body>
</html>
Aucun commentaire:
Enregistrer un commentaire