Угловой JS передает массив строк в директиву

Question

Угловой JS передает массив строк в директиву

0

У меня есть директива ниже, которая выводит число и соответствующее строковое значение из данных массива.

var app = angular.module("test",[]);

app.controller("Ctrl1",function($scope){
    $scope.range = 5;
    $scope.data = ['a','b','c','d','e',];
});
app.directive("myDirective", function(){
    return {
        restrict: "EA",
        scope: true,
        template: "<div ng-repeat='n in [] | range:range'>{{n + 1}} - {{data[n]}}</div>"
    };
})
.filter('range', function() {
  return function(input, total) {
    total = parseInt(total);
    for (var i=0; i<total; i++)
      input.push(i);
    return input;
  };
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="test">
    <div ng-controller="Ctrl1">
        <label>Edit range </label> <input ng-model="range" /><br>
      <label>edit data </label> <input ng-model="data" /><br>
        <my-directive></my-directive>
    </div>
</div>

Это работает, как ожидалось от нагрузки, однако, когда пользователь редактирует ng-model="data" выходные разрывы, как он в том числе , в качестве элемента массива.

Каков наилучший способ заставить это работать, чтобы, когда пользователь обновляет данные, директива все еще обрабатывает массив, как это было изначально? (Я счастлив либо запятыми, либо запятыми в данных, либо другим способом, например, если требуется.)

ak85 04 июль 2015, в 10:10

Источник

Теги:

javascript

angularjs

arrays

angular-ngmodel

angularjs-directive

2 ответа

1

<input ng-model="data"/> будет записывать новое значение в строку, а не в массив. вам нужно разбить строку на массив См. http://www.w3schools.com/jsref/jsref_split.asp

Michael 04 июль 2015, в 05:52

Ещё вопросы

Vaibhav Pachauri · Accepted Answer · 2015-07-04T06-43-00.000Z

Лучше всего было бы иметь функцию для ввода и ввода входных данных в массиве. Что-то вроде следующего:

HTML:

<input type="text" ng-model="inputdata" ng-click="pushDataInArray(inputdata);"></input>
//And similarly have a function to pop the data from whichever index from the array.

JS:

$scope.pushDataInArray = function(inputdata){
 $scope.data.push(inputdata);
};

Это было бы лучшим подходом ИМО.