Comment déclarer un objet dans $scope AngularJS
J'utilise AngularJS et j'essaye de créer un modèle où j'ai un objet implicite qui appelle test et test j'ai un tableau que je veux répéter quand j'appelle une fonction à l'intérieur de mon contrôleur, mais j'obtiens erreur non définie quand j'essaie de faire pousser un objet à l'intérieur du tableau.
Voici l'exemple de mon code:
<body ng-app="MyApp" ng-controller"MyController">
<input ng-model="person.name">
<button ng-click="createPhone()">
<div data-ng-repeat="phone in person.phones">
<input ng-model="phone.number">
</div>
</div>
</div>
Voici mon Controller:
//app.controller...
$scope.createPhone(){
var phone = {number: '123456789'};
$scope.person.phones.push(phone);
}
je suis obtenir:
TypeError: impossible de définir la propriété 'phones' d'undefined.
quelqu'un Pourrait-il m'aider?
1 réponses
Vous allez vouloir faire quelque chose comme ceci:
Exemple peut être vu ici - http://jsfiddle.net/hm53pyjp/4/
HTML:
<div ng-app>
<div ng-controller="TestCtrl">
<input ng-model="person.name" />
<button ng-click="createPhone()">Create Phone</button>
<div ng-repeat="phone in person.phones">
<input ng-model="phone.number" />
</div>
</div>
</div>
Contrôleur:
Créer un person objet que vous pouvez ajouter des choses et de créer une fonction pour pousser les objets.
Donc ici, j'ai créé un person avec les propriétés name et phones. J'ai donner l' name propriété d'une valeur de "Utilisateur" et le phones propriété d'un tableau de nombres. Dans ce cas, je viens de remplir un numéro pour commencer.
La fonction est appelée sur le ng-click et pousse simplement un objet à l'existant phones array.
comme vous poussez les objets vers le tableau le ng-repeat va commencer à mettre à jour les entrées sur la page.
function TestCtrl($scope) {
$scope.person = {
name : "User",
phones : [{number: 12345}]
};
$scope.createPhone = function () {
$scope.person.phones.push({
'number' : '111-222'
});
};
}