Save về thành file angular.min.js, bỏ vào cấu trúc thư mục như sau:
public
--vendor
----angularjs
------angular.min.js
Step 2: download thư viện sử dụng AngularJS để làm giỏ hàng (ngCart)
Download ngCart tại đây (phiên bản đã được mình sửa lỗi): ngCart
Giải nén, tạo thành cấu trúc thư mục như sau:
public
--vendor
----ngCart
------*.* các file được giải nén của ngCart
Step 3: khởi tạo ứng dụng AngularJS trong Laravel
Hiệu chỉnh file layouts của backend resources/views/frontend/layouts/master.blade.php
Trong thẻ <html> bỏ sung tiền chỉ lệnh ng-app="sunshineApp"
Bổ sung đoạn script khởi tạo ứng dụng AngularJS và đổi cú pháp render của AngularJS (do Laravel và AngularJS đều sử dụng dấu ngoặc nhọn {{ }} để render => chúng ta sẽ đổi cú pháp render của AngularJS thành <% %>
<!DOCTYPE html>
<html lang="en" ng-app="sunshineApp">
<head>
...
</head>
<body class="animsition">
...
<script src="{{ asset('themes/cozastore/js/main.js') }}"></script>
<!-- Include AngularJS -->
<script src="{{ asset('vendor/angularjs/angular.min.js') }}"></script>
<!-- Include thư viện quản lý Cart - AngularJS -->
<script src="{{ asset('vendor/ngCart/dist/ngCart.js') }}"></script>
<script>
// Khởi tạo ứng dụng AngularJS, sử dụng plugin ngCart
// Do Laravel và AngularJS đều sử dụng dấu `Double bracket` để render dữ liệu
// => để tránh bị xung đột cú pháp, ta sẽ đổi cú pháp render dữ liệu của AngularJS thành <% %>
var app = angular.module('sunshineApp', ['ngCart'],
function($interpolateProvider) {
$interpolateProvider.startSymbol('<%');
$interpolateProvider.endSymbol('%>');
});
</script>
<!-- Các custom script dành riêng cho từng view -->
@yield('custom-scripts')
</body>
</html>