Làm cách nào để truy cập các dịch vụ từ RESTful API trong trang anglejs của tôi?

Tôi còn rất mới với góc cạnhJS. Tôi đang tìm kiếm cách truy cập các dịch vụ từ RESTful API, nhưng tôi không hiểu. Làm thế nào tôi có thể làm điều đó?

Tùy chọn 1: Dịch vụ $ http

AngularJS cung cấp $httpdịch vụ thực hiện chính xác những gì bạn muốn: Gửi yêu cầu AJAX đến các dịch vụ web và nhận dữ liệu từ chúng, sử dụng JSON (hoàn toàn phù hợp để nói chuyện với các dịch vụ REST).

Để đưa ra một ví dụ (lấy từ tài liệu AngularJS và được điều chỉnh một chút):

$http({ method: 'GET', url: '/foo' }).
  success(function (data, status, headers, config) {
    // ...
  }).
  error(function (data, status, headers, config) {
    // ...
  });

Tùy chọn 2: Dịch vụ tài nguyên $

Xin lưu ý rằng cũng có một dịch vụ khác trong AngularJS, $resourcedịch vụ cung cấp quyền truy cập vào các dịch vụ REST theo kiểu cấp cao hơn (ví dụ được lấy lại từ tài liệu AngularJS):

var Users = $resource('/user/:userId', { userId: '@id' });
var user = Users.get({ userId: 123 }, function () {
  user.abc = true;
  user.$save();
});

Tùy chọn 3: Hình chữ nhật

Hơn nữa, cũng có các giải pháp của bên thứ ba, chẳng hạn như Restangular . Xem tài liệu của nó về cách sử dụng nó. Về cơ bản, đó là cách khai báo nhiều hơn và tóm tắt nhiều chi tiết hơn từ bạn.

Các $ http dịch vụ có thể được sử dụng cho AJAX mục đích chung. Nếu bạn có một API RESTful thích hợp, bạn nên xem qua ngResource .

Bạn cũng có thể xem qua Restangular , là thư viện của bên thứ ba để xử lý các API REST dễ dàng.

Chào mừng bạn đến với thế giới tuyệt vời của Angular !!

Tôi còn rất mới với góc cạnhJS. Tôi đang tìm kiếm để truy cập các dịch vụ từ RESTful API nhưng tôi không hiểu. hãy giúp tôi làm điều đó. Cảm ơn bạn

Có hai trở ngại (rất lớn) đối với việc viết các tập lệnh Angular đầu tiên của bạn, nếu bạn hiện đang sử dụng dịch vụ 'GET'.

Đầu tiên, các dịch vụ của bạn phải triển khai thuộc tính "Access-Control-Allow-Origin", nếu không, các dịch vụ sẽ hoạt động tốt khi được gọi từ trình duyệt web, nhưng lại thất bại thảm hại khi được gọi từ Angular.

Vì vậy, bạn sẽ cần thêm một vài dòng vào tệp web.config của mình :

<configuration>
  ... 
  <system.webServer>
    <httpErrors errorMode="Detailed"/>
    <validation validateIntegratedModeConfiguration="false"/>
    <!-- We need the following 6 lines, to let AngularJS call our REST web services -->
    <httpProtocol>
        <customHeaders>
            <add name="Access-Control-Allow-Origin" value="*"/>
            <add name="Access-Control-Allow-Headers" value="Content-Type"/>
        </customHeaders>
    </httpProtocol>
  </system.webServer>
  ... 
</configuration>

Tiếp theo, bạn cần thêm một chút mã vào tệp HTML của mình, để buộc Angular gọi các dịch vụ web 'GET':

// Make sure AngularJS calls our WCF Service as a "GET", rather than as an "OPTION"
var myApp = angular.module('myApp', []);
myApp.config(['$httpProvider', function ($httpProvider) {
    $httpProvider.defaults.useXDomain = true;
    delete $httpProvider.defaults.headers.common['X-Requested-With'];
}]);

Khi bạn đã có những bản sửa lỗi này, việc gọi một API RESTful thực sự rất đơn giản.

function YourAngularController($scope, $http) 
{
    $http.get('http://www.iNorthwind.com/Service1.svc/getAllCustomers')
        .success(function (data) {
        //  
        //  Do something with the data !
        //  
    });
}

Bạn có thể tìm thấy hướng dẫn thực sự rõ ràng về các bước này trên trang web này:

Sử dụng Angular, với dữ liệu JSON

Chúc may mắn !

Mike

Chỉ để mở rộng $http(các phương pháp tắt) tại đây: http://docs.angularjs.org/api/ng.$http

// Đoạn mã từ trang

$http.get('/someUrl').success(successCallback);
$http.post('/someUrl', data).success(successCallback);

// các phương thức tắt có sẵn

$http.get
$http.head
$http.post
$http.put
$http.delete
$http.jsonp

Ví dụ: json của bạn trông giống như sau: {"id": 1, "content": "Hello, World!"}

Bạn có thể truy cập điều này thông qua anglejs như sau:

angular.module('app', [])
    .controller('myApp', function($scope, $http) {
        $http.get('http://yourapp/api').
            then(function(response) {
                $scope.datafromapi = response.data;
            });
    });

Sau đó, trên html của bạn, bạn sẽ làm như thế này:

<!doctype html>
<html ng-app="myApp">
    <head>
        <title>Hello AngularJS</title>
        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular.min.js"></script>
        <script src="hello.js"></script>
    </head>

    <body>
        <div ng-controller="myApp">
            <p>The ID is {{datafromapi.id}}</p>
            <p>The content is {{datafromapi.content}}</p>
        </div>
    </body>
</html>

Điều này gọi CDN cho anglejs trong trường hợp bạn không muốn tải chúng xuống.

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular.min.js"></script>
<script src="hello.js"></script>

Hi vọng điêu nay co ich.