Question

我正在创建一个Json对象。在我创建数组的过程中，当用户点击添加按钮时，数组将动态推送一些字段，我想将动态字段值存储在名为 table 的范围变量中并传递这是submit() function，因此当用户点击保存按钮时，它会调用submit() function，然后使用$http将该字段值发送到节点。发送到节点js服务器的值不会插入表

HTML

<form ng-controller="NewTableCtrl" ng-app="myApp" name="frm" class="form-inline" ng-submit="submitTable()">
      <input type="string" name="cat_name" class="form-control" ng-model="table.cat_name" placeholder="Enter Category Name" ng-pattern="/^[a-zA-Z]*$/" required>
      <input type="text" name="cat_desc" class="form-control" ng-model="table.cat_desc" placeholder="Enter Your Description" ng-pattern="/^[a-zA-Z]*$/" required>
      <input type="disable" class="form-control"  name="count" ng-model="table.fields.length">
      <fieldset ng-repeat="field in table.fields track by $index" >
      <input type="text" ng-model="table.fields[$index].item_name" class="form-control" name="item_name" placeholder="Category Item Name" ng-pattern="/^[a-zA-Z]*$/" required>
      <input type="text" ng-model="table.fields[$index].item_desc" class="form-control" name="item_desc" placeholder="Category Item Description" ng-pattern="/^[a-zA-Z]*$/" required>
      <input type="number" ng-model="table.fields[$index].item_count" class="form-control" name="item_count" ng-pattern="/^[0-9]/" placeholder="Category Item View Count" required>
          <div class="form-group move-down">
              <label for="Autocomplete">Generic Autocomplete</label>
              <input type="text" id="Autocomplete" class="form-control" ng-autocomplete="table.fields[$index].result1" details="details1" options="options1"/>
          </div>
          <span class="help-block well" ng-show="frm.item_count.$error.pattern">numbers only allowed</span>
             <button ng-click="removeChoice()" class="remove btn btn-danger" >close</button>
          </fieldset>
         <!--  <button ng-click="removeChoice()" >close</button> -->
         <div>
             <button class="addfields btn btn-success" ng-disabled="!frm.cat_name.$dirty||!frm.cat_desc.$dirty||frm.cat_desc.$invalid||frm.cat_name.$inavalid||!frm.item_name.$dirty||frm.item_name.$invalid||!frm.item_desc.$dirty||frm.item_desc.$invalid||!frm.item_count.$dirty||frm.item_count.$invalid" ng-click="submit(table)">Save</button>
             <button class="addfields btn btn-success" ng-click="addFormField()" ng-disabled="!frm.cat_name.$dirty||!frm.cat_desc.$dirty||frm.cat_desc.$invalid||frm.cat_name.$inavalid">Add fields</button>
         </div>
         <span class="help-block" class="well" style="color:red" ng-show="frm.cat_desc.$error.pattern">ERROR:<BR/>text only allowed</span >
         <span class="help-block" class="well" style="color:red" ng-show="frm.cat_name.$error.pattern">ERROR:<BR/>text only allowed</span >
         <span class="help-block" style="color:red" ng-show="frm.item_desc.$error.pattern">ERROR:<BR/>text only allowed</span >  
         <span class="help-block" style="color:red" ng-show="frm.item_name.$error.pattern">ERROR:<BR/>text only allowed</span >
            <pre>{{ table | json }}</pre>
</form>

Angular Code

 var app = angular.module('myApp', ['ngAutocomplete']);
     app.controller('NewTableCtrl', function($scope,$http) {
     var counter=0;
     $scope.table = { fields: [] };
     $scope.addFormField = function() {
     $scope.table.fields.push('');            

    }
   $scope.submitTable = function() {
         console.log($scope.table);
   }
   $scope.removeChoice = function() {
         $scope.table.fields.splice(this.$index,1);
   };  
   $scope.result1 = '';
         $scope.options1 = null;
         $scope.details1 = '';
         $scope.details3 = '';
         $scope.submit=function(category){                       
        $http({method:"post",url:"http://localhost:3000/insert",data:category})
         .then(function(data){
         /* Success callback */
         alert("Data hase been entered!");
              // console.log("success");
          },function(err){
             /* Failure callback */
             alert("Something went wrong!");
          });
        }

    });

节点

var mysql=require('mysql');
var http=require('http');
var uuid = require('node-uuid');
var path=require('path');
var express=require('express');
var app=express();
var bodyparser=require('body-parser');
app.use(bodyparser.json());       
app.use(bodyparser.urlencoded({extended: true})); 
var myconnection = mysql.createConnection({
host : "localhost",

user : "root",

password : "",

database : "siva"
});
app.use(express.static(__dirname + ""));
var uqid= uuid.v1();
var it_id=uuid.v4();
var tt=1;
var status="active";
app.post("/insert",function(req,res){
    console.log(req.body);
    /* TODO: Now just check that your drive function is correct, SQL is correct and whether what arguements passed to SQL callback is correct */
    myconnection.query('Insert into cate_tbl (cat_id,cat_name,cat_desc,cat_view_count,cat_status) VALUES ("'+uqid+'","'+req.body.cat_name+'","'+req.body.cat_desc+'","'+tt+'","'+status+'")',function(err, results, fields) {
        //if (err) throw err;
        if (err) {console.log("DB Error"+err); res.send("add failed"+err);}
        else res.send("add success");
    });
      myconnection.query('Insert into cate_item (cat_it_id,cat_it_name,cat_pid,cat_it_count,cat_it_desc,cat_it_status) VALUES ("'+it_id+'","'+req.body.item_name+'","'+uqid+'","'+req.body.tem_count+'","'+req.body.item_desc+'","'+status+'")',function(err, results, fields) {
        //if (err) throw err;
        if (err) {console.log("DB Error"+err); res.send("add failed"+err);}
        else res.send("add success");
    });
});
app.get('/',function(req,res){
    res.sendfile("index.html");
});

app.listen(3000,function(){
    console.log("It's Started on PORT 3000");
})

Angular json数组数据不使用节点js插入mysql数据库

0 个答案: