Thanh Phuc: tháng 12 2016

Thứ Năm, 29 tháng 12, 2016

OPEN GRAPH LÀ GÌ VÀ TẠI SAO TA CẦN NÓ?

Open Graph Protocol biến website của bạn trở thành một phần của mạng xã hội. Nó bao gồm các thẻ để bạn định nghĩa dữ liệu có cấu trúc giúp cho việc chia sẽ dữ liệu giữa trang web với các trang mạng xã hội dễ dàng hơn. Ví dụ : khi người dùng facebook click vào nút like trên trang web của bạn, thì trang web của bạn sẽ xuất hiện trên trang facebook có nhân của người đó.

Cách thực hiện như sau:

Bạn đặt thẻ <meta> trong head của trang web. Có bốn thuộc tính yêu cầu cho mỗi trang:

og:title – Tiêu đề trang web. Ví dụ, “Open Graph là gì và tại sao ta cần nó?”.
og:type – Loại đối tượng, ví dụ, “video.movie”. Tùy loại đối tượng mà ta cần khai báo thêm một số thuộc tính khác. Chẳng hạn, hình ảnh thì cần khai báo thêm kích thước.
og:image – Đường dẫn tới ảnh thumbnail sẽ hiển thị (khi bạn like, share…).
og:url – Đường dẫn tới trang web, ví dụ, http://www.imdb.com/title/ tt0117500/

<html prefix="og: http://ogp.me/ns#">

<head>

<title>The Rock (1996)</title>

<meta property="og:title" content="The Rock" />

<meta property="og:type" content="video.movie" />

<meta property="og:url" content="http://www.imdb.com/title/tt0117500/" />

<meta property="og:image" content="http://ia.media-imdb.com/images/rock.jpg" />

...

</head>

...

</html>

Ngoài ra còn có nhiều thuộc tính khác, chi tiết tại http://ogp.me/

Thứ Năm, 22 tháng 12, 2016

Cách khai báo một Controller trong Anguarjs

Có 2 cách khai báo một Controller trong Angularjs:

Cách 1:

angular.module("productPageApp").controller("ProductPageController",function($scope){

$scope.isQuickViewMode=4;

});

angular.module("productPageApp").directive("productPage", function($filter){

var directive = {

restrict: "E",

templateUrl: "product-page.directive.html",

controller: "ProductPageController",

};

return directive;

});

Trong trang product-page.directive.html

<div>

</div>

Cách 2:

angular.module("productPageApp").controller("ProductPageController", ProductPageController);

ProductPageController.$inject = [ "$log", "$scope", "$filter", "$window"];

function ProductPageController($log, $scope, $filter, $window) {

var productPageCtrl = this;

productPageCtrl.isQuickViewMode = "1";

}