Angular Entity Framework Sample
Hi David,
We have prepared the ASP.NET MVC database sample and loaded the database into the Angular QueryBuilder sample. Please refer to the below code snippet and sample.
Server Sample
HomeController.cs
|
public class HomeController : Controller {
NORTHWNDEntities1 db = new NORTHWNDEntities1(); public ActionResult Index() { return View(); } public ActionResult UrlDatasource(DataManagerRequest dm) { IQueryable DataSource = db.C30000Records.AsQueryable();
QueryableOperation operation = new QueryableOperation(); if (dm.Where != null) { DataSource = operation.PerformFiltering((IQueryable<C30000Records>)DataSource, dm.Where, dm.Where[0].Condition); if (!dm.RequiresCounts) { return Json(DataSource); } } if (dm.Search != null) { DataSource = operation.PerformSearching((IQueryable<C30000Records>)DataSource, dm.Search); } int count = DataSource.Cast<C30000Records>().Count(); if (dm.Sorted != null) { DataSource = operation.PerformSorting((IQueryable<C30000Records>)DataSource, dm.Sorted); } if (dm.Skip != 0) { DataSource = operation.PerformSkip((IQueryable<C30000Records>)DataSource, dm.Skip); //Paging } if (dm.Take != 0) { DataSource = operation.PerformTake((IQueryable<C30000Records>)DataSource, dm.Take); } var countData = Json(new { result = DataSource, count = count }, JsonRequestBehavior.AllowGet); var orgData = Json(DataSource, JsonRequestBehavior.AllowGet); countData.MaxJsonLength = int.MaxValue; orgData.MaxJsonLength = int.MaxValue; return dm.RequiresCounts ? countData : orgData; } } |
Northwindcontext.cs
|
public partial class NORTHWNDEntities1 : DbContext { public NORTHWNDEntities1() : base("name=NORTHWNDEntities1") { }
protected override void OnModelCreating(DbModelBuilder modelBuilder) { throw new UnintentionalCodeFirstException(); }
public virtual DbSet<C30000Records> C30000Records { get; set; } } |
Webconfig.cs
|
<connectionStrings><add name="NORTHWNDEntities" connectionString="metadata=res://*/NorthWndModel.csdl|res://*/NorthWndModel.ssdl|res://*/NorthWndModel.msl;provider=System.Data.SqlClient;provider connection string="data source=(LocalDB)\MSSQLLocalDB;attachdbfilename=|DataDirectory|\NORTHWND.MDF;integrated security=True;MultipleActiveResultSets=True;App=EntityFramework"" providerName="System.Data.EntityClient" /> <add name="NORTHWNDEntities1" connectionString="metadata=res://*/Models.NorthWnd.csdl|res://*/Models.NorthWnd.ssdl|res://*/Models.NorthWnd.msl;provider=System.Data.SqlClient;provider connection string="data source=(LocalDB)\MSSQLLocalDB;attachdbfilename=|DataDirectory|\NORTHWND.MDF;integrated security=True;multipleactiveresultsets=True;application name=EntityFramework"" providerName="System.Data.EntityClient" /></connectionStrings>
|
MVC Sample link: https://www.syncfusion.com/downloads/support/directtrac/general/ze/QueryableData443781677.zip
After running the MVC sample, the data source was loaded into the Angular samples.
Client Sample
|
<ejs-querybuilder #querybuilder width="70%" [dataSource]="data" > </ejs-querybuilder> …. public data?: DataManager; ngOnInit(): void { this.data = new DataManager({ url: 'http://localhost:60474/Home/UrlDatasource', adaptor: new WebApiAdaptor }); }; |
Angular Sample link: https://stackblitz.com/edit/github-s9qtt2-j9npem?file=src%2Fapp.component.ts
Screenshot:
Database:
Output:
Please let us know if you need any further assistance on this.
Regards,
KeerthiKaran K V
Thanks for the samples. I can't seem to get the stackblitz to process the data. I've attached the error
