非同步調用

如果有寫過 jQuery 的人幾乎都使用過 $.ajax()、$.get()、$.post() 等方法， 照著官方文件去實作的話其實都不會有什麼問題，簡單到你覺得非常不可思議。

$.ajax({
  url: url,
  data: data,
  success: success,
  dataType: dataType
});

在不考慮同源政策的情況下，我們一樣可以在 AngularJS 中繼續使用 jQuery 的做法去實現非同步調用的需求。

這邊我們使用 Slack.chatPostMessage API 作為示範。

Basic message Formatting

Tokens for Testing and Development

其實官方的範本你會發現到都是用 Get 去發請求，可是文件寫 Post 也能接收，最後才發現是用表單接收。

$.ajax({
  type: "POST",
  url: 'https://slack.com/api/chat.postMessage',
  data: $.param(self.postData),
  success: function(result) {
    self.resData = result;
  },
  dataType: 'application/x-www-form-urlencoded'
});

JS Bin

會發現其實我們用了 $.ajax 之後，畫面的 Response 並沒有呈現出來，這是因為我們宣告了 HTML DOM 由 AngularJS 控管，在 JavaSript 內用的不是 AngularJS 提供的方式調用就脫離的 AngularJS 控管了。

AngularJS 提供的 $http 比較要注意的是它在 Get 或 Post 底下標頭預設都是

Accept: application/json, text/plain, * / *
Content-Type: application/json

JS Bin