Я хочу, чтобы это было решено только в angular - js.
<head>
@Scripts.Render("~/bundles/AddEmployee")
</head>
<body ng-app="TruModule">
<div ng-controller="trucontrolleraddemp">
<div style="margin-top:-20px;">
<h1 class="decor">Add Employee</h1>
<form name="emp" novalidate class="warn container" ng-mouseover="hidemessage()">
<div class="col-md-offset-2 row">
<div class="col-sm-4">
<table class="margin">
<tr>
<td>
<label for="id">Id*   :</label>
</td>
<td>
<span>{{id}}</span>
</td>
</tr>
<tr>
<td>
<label for="name">Name* :</label>
</td>
<td>
<input type="text" name="name" ng-model="employee.name" ng-required="true" ng-minlength="2" />
<span ng-show="emp.name.$touched && emp.name.$error.minlength">too short!!!</span>
</td>
</tr>
<tr>
<td>
<label for="role">Role  :</label>
</td>
<td>
<input type="text" name="role" ng-model="employee.role" ng-maxlength="3" />
<span ng-show="emp.role.$touched && emp.role.$error.maxlength">exceed!!!</span>
</td>
</tr>
<tr>
@* <td>
<label for="role">tech  :</label>
</td>
<td>
<input type="text" name="role" ng-model="technology.tech" ng-maxlength="6" />
<span ng-show="emp.role.$touched && emp.role.$error.maxlength">exceed!!!</span>
</td>*@
</tr>
</table>
</div>
<div class="col-sm-4">
<table id="tblEmployee">
<tr>
<td>
<label for="tech">Technologies* :</label>
</td>
<td>
<ul>
<li ng-repeat="techno in technology track by $index">
<input type="text" name="tech" ng-model="employee.technology[$index].tech" ng-required="true" ng-minlength="2" />
</li>
</ul>
</td>
<td>
<span><button class="img" ng-click="addtech()">+</button></span><br/><span><button class="img" ng-click="removetech()">-</button></span>
</td>
</tr>
</table>
</div>
</div>
</form>
<div class="mainloc">
<span><a class="img" href="#!Employee"><</a><button class="img position" ng-click="postdata(employee)" value="Submit">+</button> </span>
</div>
<span class="position" ng-hide="IsShown">
<img src="~/reload.gif" />
</span><span style="visibility:hidden"><img src="~/reload.gif" /></span>
<div class="dex alertpos" ng-hide="IsVisible">{{message}}</div>
</div>
<hr style="margin-top:91px;" />
</div>
</body>
Я хочу, чтобы данные были в следующем формате. это формат, принятый сотрудником модели в контроллере в webapi.
{
"id":1,
"name":"erk",
"role": "sa",
"technologies":[
{"tech":"Test3"},
{"tech":"Test1"},
]
},
}
the format i am getting is like
this
{"id":4,
"name":"Sam",
"role":"sa",
"technology
":{"0":{"tech":"dfg"},
"1": {"tech":"dfgdfg"}},
}
Я пытался использовать [$ index], чтобы убедиться, что каждое текстовое поле получает различное значение. Но так как он возвращает объекты с индексами, я не хочу так. Я хочу, чтобы это было заменено технологией.
/// <reference path="../scripts/angular-route.min.js" />
/// <reference path="../scripts/angular.min.js" />
/// <reference path="../scripts/angular-route.js" />
trumodule.service("idgenerator", function () {
this.idfunc = function () {
return Math.floor(((Math.random()) * 6) + 1);
}
});
var trucontrolleraddemp = function ($scope, $http, $timeout, $route, idgenerator) {
var id = idgenerator.idfunc();
$scope.id = id;
$scope.IsShown = true;
$scope.technology = [];
$scope.addtech = function () {
$scope.technology.push({});
}
$scope.removetech = function () {
$scope.technology.pop({});
}
$scope.postdata = function (data) {
if (data)
$scope.IsShown = false;
data.id = id
var employee = JSON.stringify(data);
$http({ method: "Post", url: '/api/values', data: employee, headers: { 'Content-Type': 'application/json' } })
.then(function (response) {
$scope.IsVisible = false;
$scope.message = response.data;
$timeout(function () {
$route.reload();
}, 2000);
});
}
$scope.message = "Please fill the fields to register a new Employee";
$scope.hidemessage = function () {
$scope.IsVisible = true;
}
$timeout(function () {
$scope.message = "Its mandatory to fill fields with *";
}, 2000);
}
trumodule.controller("trucontrolleraddemp", trucontrolleraddemp);
У меня есть сотрудник класса, в котором у меня есть поля id, name, role и list technologies для технологии типов, это еще один класс, содержащий технологию строковых полей, я хочу, чтобы данные заполнялись этим с помощью нг-повтор.
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
namespace WebAPI_Angular.Models
{
public class Employee
{
public int id;
public string name;
public string role;
//public DateTime DoB;
public List<technology> technologies;
}
public class technology
{
public string tech;
}
}