Tất cả phụ thuộc vào những gì bạn muốn từ đoạn mã của mình. Cá nhân tôi, nếu mã không có bất kỳ logic nào, hoặc thậm chí không cần bộ điều khiển, thì tôi sẽ sử dụng ngInclude. Tôi thường đặt nhiều đoạn html "tĩnh" lớn hơn mà tôi không muốn làm lộn xộn chế độ xem ở đây. (ví dụ: Giả sử một bảng lớn có dữ liệu đến từ Bộ điều khiển mẹ. Sẽ sạch <div ng-include="bigtable.html" />hơn tất cả những dòng đó làm lộn xộn Chế độ xem)
Nếu có logic, thao tác DOM hoặc bạn cần nó có thể tùy chỉnh (hay còn gọi là hiển thị khác nhau) trong các trường hợp khác nhau mà nó được sử dụng, thì directiveslựa chọn tốt hơn (lúc đầu chúng hơi nản, nhưng chúng rất mạnh, hãy cho nó thời gian) .
ngInclude
Đôi khi bạn sẽ thấy ngInclude'srằng bị ảnh hưởng bởi bên ngoài của chúng $scope/ interface. Chẳng hạn như một bộ lặp lớn / phức tạp cho phép nói. 2 giao diện này được gắn với nhau vì điều này. Nếu điều gì đó trong phần chính $scopethay đổi, bạn phải thay đổi / thay đổi logic của mình trong phần được bao gồm của bạn.
Chỉ thị
Mặt khác, các chỉ thị có thể có phạm vi / bộ điều khiển rõ ràng / v.v. Vì vậy, nếu bạn đang nghĩ đến một tình huống mà bạn phải sử dụng lại thứ gì đó nhiều lần, bạn có thể thấy việc kết nối phạm vi riêng của nó sẽ giúp cuộc sống dễ dàng hơn và ít hơn gây nhầm lẫn.
Ngoài ra, bất cứ khi nào bạn định tương tác với DOM, bạn nên sử dụng một chỉ thị. Điều này làm cho nó tốt hơn cho việc kiểm tra và tách các hành động này khỏi bộ điều khiển / dịch vụ / v.v., đó là điều bạn muốn!
Mẹo: Đảm bảo không sử dụng hạn chế: 'E' nếu bạn quan tâm đến IE8! Có nhiều cách để giải quyết vấn đề này, nhưng chúng gây khó chịu. Chỉ cần làm cho cuộc sống dễ dàng hơn và gắn bó với thuộc tính / etc.<div my-directive />
Thành phần [Cập nhật 3/1/2016]
Được thêm vào Angular 1.5, về cơ bản nó là một trình bao bọc xung quanh .directve(). Thành phần nên được sử dụng hầu hết thời gian. Nó loại bỏ rất nhiều mã chỉ thị soạn sẵn, bằng cách đặt mặc định những thứ như restrict: 'E', scope : {}, bindToController: true. Tôi thực sự khuyên bạn nên sử dụng những thứ này cho hầu hết mọi thứ trong ứng dụng của bạn, để có thể chuyển đổi sang Angular2 dễ dàng hơn.
Tóm lại là:
Bạn nên tạo các Thành phần & Chỉ thị phần lớn thời gian.
- Có thể mở rộng hơn
- Bạn có thể tạo mẫu và có tệp của mình bên ngoài (như ngInclude)
- Bạn có thể chọn sử dụng phạm vi chính hoặc phạm vi cô lập riêng trong chỉ thị.
- Tái sử dụng tốt hơn trong suốt ứng dụng của bạn
Cập nhật 3/1/2016
Bây giờ Angular 2 đang dần kết thúc và chúng tôi biết định dạng chung (tất nhiên vẫn sẽ có một số thay đổi ở đây và ở đó) chỉ muốn thêm nó quan trọng như thế nào để thực hiện components(đôi khi chỉ thị nếu bạn cần chúng bị hạn chế: ' E 'chẳng hạn).
Các thành phần rất giống với Angular 2 @Component. Bằng cách này, chúng ta đang đóng gói logic & html trong cùng một khu vực.
Hãy chắc chắn rằng bạn đóng gói nhiều thứ nhất có thể trong các thành phần, nó sẽ giúp quá trình chuyển đổi sang Angular 2 dễ dàng hơn nhiều! (Nếu bạn chọn thực hiện chuyển đổi)
Đây là một bài viết hay mô tả quá trình di chuyển này bằng cách sử dụng directives(tất nhiên rất giống nếu bạn định sử dụng các thành phần): http://angular-tips.com/blog/2015/09/migrating-directives-to-angular-2/