angular js 添加 JSON 到 ng-list
angular js add JSON to ng-list
我有 3 个属性包括 JSON 对象数组 'notes'。
$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 个对象。
编写您自己的指令
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 映射到文本
我有 3 个属性包括 JSON 对象数组 'notes'。
$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 个对象。
编写您自己的指令
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 映射到文本