Question

我有3个属性，包括JSON对象数组＆＃39; notes＆＃39;。

$scope.notes = [
        {
            'type':'txt',
            'name': 'JohnHenry',
            'text':'Greeting',
        }
    ];

我的输入字段是

`<input type="text" placeholder="Text here..." ng-model="note.input" ng-list="," ng-enter="addnote()">`

我将在下面的文字中键入输入文本字段。

"txt-Glen-Negotiate Price, num-Phil-0939876, met-DrWalh-1505"

type属性是显示图标。我希望得到如下JSON

$scope.notes = [
        {
            'type':'txt',
            'name': 'JohnHenry',
            'text':'Greeting',
        },{
            'type':'txt',
            'name': 'Glen',
            'text':'negotiate price',
        },{
            'type':'num',
            'name': 'Phil',
            'text':'0939876',
        },{
            'type':'met',
            'name': 'DrWalh',
            'text':'1505',
        }
    ];

如何将输入ng-list文本转换为JSON对象。

Answer 1

编写自己的指令

app.directive('jsonConvert', function(){
  return {
    require: 'ngModel',
    link: function (scope, elm, attrs, ngModel){
      scope.$watch(
        function(){
            return ngModel.$modelValue;
        }, function(newValue, oldValue){
            var value = ngModel.$modelValue
            if (value instanceof Array) return;
            var valueArr = value ? value.split(',') : value;
            if (!valueArr) return;
            for (var i = 0; i < valueArr.length; i++){
              if (valueArr[i]){
                var splitItem = valueArr[i].split("-");
              }
              valueArr[i] = {
                type: splitItem[0] ? splitItem[0] : '',
                name: splitItem[1] ? splitItem[1] : '',
                text:  splitItem[2] ? splitItem[2] : ''
              }
            }
            var result = valueArr;
            ngModel.$setViewValue(result);
        }, true);
    }
  }
})

虽然您定义所需内容的方式可能不具有可扩展性或最佳实践，因为它将0映射到类型，1代表名称，2代表文本

示例 - http://plnkr.co/edit/vtcpiYsTYKq3H2QTupyS?p=preview

angular js将JSON添加到ng-list

1 个答案: