我必须使用Angular JS在Html页面中将数据库表填充为网格视图。我使用cs文件和数据访问层来获取表数据的Json字符串。现在我如何将json字符串处理成Html页面?
答案 0 :(得分:0)
我有类似的要求,但我需要使用json文件填充一组字段,为了实现这一点,我使用了angular formly,它读取JSON文件并将其转换为表单UI输入
您可以了解角度here
在角度js中创建服务并从数据库中获取JSON数据,然后使用angular formly动态填充网格UI
这是我通过读取JSON文件使用角度形式创建表单输入的代码(此代码是为了获取IDEA)
<div ng-app="testApp">
<div ng-controller="helloController as mycont">
<div class="container row">
<form ng-submit="mycont.onSubmit()" name="mycont.form_nme">
<formly-form model="mycont.test" fields="mycont.testFields">
<button class="btn btn-primary" type="submit" ng-disabled="mycont.form_nme.$invalid">Submit</button>
</formly-form>
</form>
</div>
</div>
</div>
<script>
var app = angular.module('testApp', ['formly', 'formlyBootstrap']);
app.controller('helloController', function () {
var fields = this;
fields.testFields = [{
key: 'Name',
type: 'input',
templateOptions: {
label: 'Full Name',
placeholder: 'Enter your Full name',
required: true
}
}, {
key: 'address',
type: 'textarea',
templateOptions: {
label: 'Address',
placeholder: 'Enter your address',
required: true
}
}, {
key: 'city',
type: 'input',
templateOptions: {
label: 'City',
placeholder: 'Enter your city',
required: true
}
}, {
key: 'pincode',
type: 'input',
templateOptions: {
label: 'Pin Code',
placeholder: 'Enter your Pin code',
required: true
}
}];
fields.onSubmit = onSubmit;
function onSubmit() {
alert('form submitted: ' + JSON.stringify(fields.test));
}
});
</script>