我正在尝试创建一个保存电话的数组，我有这个代码
<input type="text" ng-model="telephone[0]" />
<input type="text" ng-model="telephone[1]" />
但我无法访问 $scope.telephone
如何使用 AngularJS 的 ng-model 创建数组
IT技术
javascript
angularjs
2021-03-04 19:11:58
6个回答
首先是第一件事。您需要$scope.telephone在控制器中定义为一个数组，然后才能开始在视图中使用它。
$scope.telephone = [];
要解决在附加新输入时无法识别 ng-model 的问题 - 为此，您必须使用$compileAngular 服务。
来自$compile 上的Angular.js API 参考：
将 HTML 字符串或 DOM 编译为模板并生成模板函数，然后可以使用该函数将作用域和模板链接在一起。
// I'm using Angular syntax. Using jQuery will have the same effect
// Create input element
var input = angular.element('<div><input type="text" ng-model="telephone[' + $scope.inputCounter + ']"></div>');
// Compile the HTML and assign to scope
var compile = $compile(input)($scope);
看看JSFiddle
它对我来说很好用：http : //jsfiddle.net/qwertynl/htb9h/
我的javascript：
var app = angular.module("myApp", [])
app.controller("MyCtrl", ['$scope', function($scope) {
$scope.telephone = []; // << remember to set this
}]);
你可以做各种各样的事情。我会做的是这个。
在范围上创建一个数组，它将成为电话号码的数据结构。
$scope.telephone = '';
$scope.numbers = [];
然后在你的 html 中我会有这个
<input type="text" ng-model="telephone">
<button ng-click="submitNumber()">Submit</button>
然后，当您的用户单击提交时，运行 submitNumber()，它将新的电话号码推送到 numbers 数组中。
$scope.submitNumber = function(){
$scope.numbers.push($scope.telephone);
}
一种方法是将数组转换为对象并在范围内使用它（数组的模拟）。这种方式有利于维护模板。
$scope.telephone = {};
for (var i = 0, l = $scope.phones.length; i < l; i++) {
$scope.telephone[i.toString()] = $scope.phone[i];
}
<input type="text" ng-model="telephone[0.toString()]" />
<input type="text" ng-model="telephone[1.toString()]" />
并在保存时，将其改回。
$scope.phones = [];
for (var i in $scope.telephone) {
$scope.phones[parseInt(i)] = $scope.telephone[i];
}
这应该有效。
app = angular.module('plunker', [])
app.controller 'MainCtrl', ($scope) ->
$scope.users = ['bob', 'sean', 'rocky', 'john']
$scope.test = ->
console.log $scope.users
HTML：
<input ng-repeat="user in users" ng-model="user" type="text"/>
<input type="button" value="test" ng-click="test()" />