AngularJS - Tại sao không thay thế: công việc thực sự với thuộc tính templateUrl?

Question

Tôi có một chỉ thị khá đơn giản mà tôi muốn tải mẫu từ một tệp HTML riêng biệt. Tôi muốn HTML thay thế chỉ thị và vì vậy tôi thêm thuộc tính replace: true vào chỉ thị. Tuy nhiên khi tôi làm điều này, các mẫu không nhận được bao gồm cả.

Tôi đã tạo một jsFiddle nơi bạn có thể thấy điều này. Nếu bạn sử dụng Firebug hoặc một cái gì đó để kiểm tra DOM, bạn có thể thấy rằng khi nó chỉ sử dụng thuộc tính template, nó sẽ thay thế phần tử. Nếu bạn gỡ bỏ replace: true, bạn có thể xem HTML tại số templateUrl được nối thêm vào phần tử foo. Tuy nhiên, ngay khi tôi thêm replace: true vào số templateUrl, tất cả những gì tôi thấy là <foo></foo> trong DOM.

Có lý do gì khiến bạn không thể sử dụng hai thuộc tính này cùng nhau không? Tôi xa một chuyên gia với javascript, vì vậy bất kỳ thông tin về những gì đang xảy ra ở đây sẽ được đánh giá cao.

Answer 1

Đảm bảo nội dung của html của bạn trong templateUrl có chính xác một phần tử gốc. Đây không phải là một vấn đề khi replace: false nhưng sẽ trở thành một vấn đề khi replace: true và bạn sẽ thấy lỗi này Console (với Firebug):

Error: Template must have exactly one root element. 

Đây là một jsFiddle của nó not working (với hai yếu tố gốc) và khác với nó working .

Answer 2

Câu hỏi hay. Nếu tôi không nhầm, bạn muốn sử dụng "transclude"

http://jsfiddle.net/dandoyon/AsVp8/1/

Transclude cho phép bạn pha trộn mẫu của bạn với những gì có trong HTML. Bạn có thể muốn cung cấp cho tài liệu một cái nhìn khác và tìm tùy chọn này.

cổ vũ!