我正在使用 AngularJS 并且我正在尝试创建一个模板,其中我有一个调用 test 的隐式对象并且在 test 内部我有一个我想要的数组当我在我的 Controller 中调用一个函数时重复,但是当我尝试将一个对象插入数组时我得到了未定义的错误。
这是我的代码示例:
<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>
这是我的 Controller :
//app.controller...
$scope.createPhone(){
var phone = {number: '123456789'};
$scope.person.phones.push(phone);
}
我得到:
TypeError: Cannot set property 'phones' of undefined.
谁能帮帮我?
最佳答案
你会想要做这样的事情:
例子可以在这里看到 - 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>
Controller :
创建一个 person
对象,您可以向其添加内容,并创建一个将对象推送到其中的函数。
所以在这里我创建了一个 person
属性 name
和 phones
。我为 name
属性赋予了“User”的值,为 phones
属性赋予了一个数字数组。在本例中,我只填充了一个数字即可开始。
然后在 ng-click
上调用该函数,并将对象简单地推送到现有的 phones
数组。
当您将对象推送到数组时,ng-repeat
将开始更新页面上的输入。
function TestCtrl($scope) {
$scope.person = {
name : "User",
phones : [{number: 12345}]
};
$scope.createPhone = function () {
$scope.person.phones.push({
'number' : '111-222'
});
};
}
关于javascript - 如何在 $scope AngularJS 中声明对象,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28322807/