قسمت چهاردهم AngularJS: چگونه از پایگاه داده در انگولار استفاده کنیم؟

پیشنهاد می‌شود قبل از ورود به این قسمت از آموزش‌های انگولار جی اس، قسمت‌های پیشین این آموزش را موردبررسی و مطالعه قرار دهید، در این قسمت از انگولار جی اس تقریباً به اواسط دوره رسیده و قصد معرفی و استفاده از پایگاه داده در انگولار جی اس راداریم. برای ورود به دوره‌ی انگولار جی اس کلیک کنید.

انگولار بهترین گزینه برای نمایش اطلاعات دیتابیس می‌باشد، فقط این نکته را به یاد داشته باشید که فرمت داده‌های شما JSON باشد.

به‌دست آوردن اطلاعات خروجی از یک سرور php در حال اجرا با MySQL

برای به‌دست آوردن اطلاعات خروجی کافی است از دستور $http استفاده کنیم و فایل php را فراخوانی کنیم و دستوری برای فراخوانی اطلاعات پایگاه داده قرار دهیم برای درک بهتر این موضوع شبه کد زیر را موردبررسی قرار دهید.

  

    
{{ x.Name }}
    
{{ x.Country }}
  


< script >
var app = angular.module('myApp', []);
app.controller('customersCtrl', function($scope, $http) {
   $http.get("customers_mysql.php")
   .then(function (response) {$scope.names = response.data.records;});
});

به‌دست آوردن اطلاعات خروجی از یک سرور ASP.NET در حال اجرا با SQL

همانند استفاده از اطلاعات خروجی از سرور php باید شما در ابتدا فایل خود را با دستور $http فراخوانی کنید و تابعی برای به‌دست آوردن تمام اطلاعات بنویسید. لطفاً به شبه کد زیر توجه کنید.

  

    
{{ x.Name }}
    
{{ x.Country }}
  


< script >
var app = angular.module('myApp', []);
app.controller('customersCtrl', function($scope, $http) {
    $http.get("customers_sql.aspx")
    .then(function (response) {$scope.names = response.data.records;});
});

نمونه‌های سرور کد

لیست زیر بخشی از کد سرور است که برای استخراج داده SQL استفاده می‌شود.

• استفاده از php و MySQL و گرفتن خروجی JSON
• استفاده از php و MS Access و گرفتن خروجی JSON
• استفاده از ASP.NET و VB و MS Access و گرفتن خروجی JSON
• استفاده از ASP.NET و Razor و SQL Lite و گرفتن خروجی JSON

همان‌طور که در ابتدای این آموزش اشاره شد برای استفاده از داده‌ها در انگولار جی اس باید تمامی پایگاه داده‌ها را به فرمت JSON دربیاورید.

درخواست متقابل سایت HTTP

درخواست برای داده‌ها از یک سرور متفاوت (غیر از صفحه درخواستی)، درخواست‌های متقابل HTTP نامیده می‌شود.
درخواست‌های متقابل سایت در وب رایج است. بسیاری از صفحات CSS، تصاویر و اسکریپت‌ها را از سرورهای مختلف بارگیری می‌کنند.
در مرورگرهای مدرن، درخواست‌های متقابل سایت HTTP از اسکریپت‌ها به دلایل امنیتی محدود به یک سایت می‌باشد.
خط زیر در نمونه‌های PHP ما اضافه‌شده است تا اجازه دسترسی متقابل سایت را فراهم کند.

header("Access-Control-Allow-Origin: *");

سرور کدهای php و MySQL

query("SELECT CompanyName, City, Country FROM Customers");

$outp = "";
while($rs = $result->fetch_array(MYSQLI_ASSOC)) {
  if ($outp != "") {$outp .= ",";}
  $outp .= '{"Name":"'  . $rs["CompanyName"] . '",';
  $outp .= '"City":"'   . $rs["City"]        . '",';
  $outp .= '"Country":"'. $rs["Country"]     . '"}';
}
$outp ='{"records":['.$outp.']}';
$conn->close();

echo($outp);
?>

سرور کدهای php و MS Access

open("PROVIDER=Microsoft.Jet.OLEDB.4.0;Data Source=Northwind.mdb");

$rs = $conn->execute("SELECT CompanyName, City, Country FROM Customers");

$outp = "";
while (!$rs->EOF) {
  if ($outp != "") {$outp .= ",";}
  $outp .= '{"Name":"'  . $rs["CompanyName"] . '",';
  $outp .= '"City":"'   . $rs["City"]        . '",';
  $outp .= '"Country":"'. $rs["Country"]     . '"}';
  $rs->MoveNext();
}
$outp ='{"records":['.$outp.']}';

$conn->close();

echo ($outp);
?>

سرور کدهای ASP.NET و VB و MS Access

<%@ Import Namespace="System.IO"%>
<%@ Import Namespace="System.Data"%>
<%@ Import Namespace="System.Data.OleDb"%>
<%
Response.AppendHeader("Access-Control-Allow-Origin", "*")
Response.AppendHeader("Content-type", "application/json")
Dim conn As OleDbConnection
Dim objAdapter As OleDbDataAdapter
Dim objTable As DataTable
Dim objRow As DataRow
Dim objDataSet As New DataSet()
Dim outp
Dim c
conn = New OledbConnection("Provider=Microsoft.Jet.OLEDB.4.0;data source=Northwind.mdb")
objAdapter = New OledbDataAdapter("SELECT CompanyName, City, Country FROM Customers", conn)
objAdapter.Fill(objDataSet, "myTable")
objTable=objDataSet.Tables("myTable")

outp = ""
c = chr(34)
for each x in objTable.Rows
if outp <> "" then outp = outp & ","
outp = outp & "{" & c & "Name"    & c & ":" & c & x("CompanyName") & c & ","
outp = outp &       c & "City"    & c & ":" & c & x("City")        & c & ","
outp = outp &       c & "Country" & c & ":" & c & x("Country")     & c & "}"
next

outp ="{" & c & "records" & c & ":[" & outp & "]}"
response.write(outp)
conn.close
%> 

سرور کدهای ASP.NET و Razor C# و SQL Lite

@{
Response.AppendHeader("Access-Control-Allow-Origin", "*")
Response.AppendHeader("Content-type", "application/json")
var db = Database.Open("Northwind");
var query = db.Query("SELECT CompanyName, City, Country FROM Customers");
var outp =""
var c = chr(34)
}
@foreach(var row in query){
if (outp != "") {outp = outp + ","}
outp = outp + "{" + c + "Name"    + c + ":" + c + @row.CompanyName + c + ","
outp = outp +       c + "City"    + c + ":" + c + @row.City        + c + ","
outp = outp +       c + "Country" + c + ":" + c + @row.Country     + c + "}"
}
outp ="{" + c + "records" + c + ":[" + outp + "]}"
@outp 

امیدوارم این آموزش برای شما عزیزان مفید واقع‌شده باشد، منتظر ویدیوهای این آموزش‌ها باشید، قطعاً با دیدن ویدیوها و توضیحات بیشتر درک بهتری از این موضوعات پیدا خواهید کرد.
برای مطالعه موارد بیشتر می‌توانید به سایت w3schools مراجعه فرمایید.
پیروز باشید.