Làm cách nào để truy cập các thuộc tính trong thành phần v1.5 của Angularjs?

Question

Tôi đang sử dụng thành phần v1.5, cơ bản (theo như hiểu biết của tôi mở rộng) một trình bao bọc cho các chỉ thị thực hành tốt nhất.

thông tin

Thông tin thêm về 1.5 phát hành thành phần có thể được tìm thấy ở đây: http://toddmotto.com/exploring-the-angular-1-5-component-method/

Tôi đã điều sau đây:

<span>Correclty showing: {{ data.type }}</span> 
<book class="details" type="data.type"></book> 

Và đó là thành phần định nghĩa:

angular 
.module('app') 
.component('book', { 
    bindings: { 
     type: '=' 
    }, 
    template: function($element, $attrs) { 
     // Have tried A): 
     // console.log($attrs.type); // <- undefined 

     // And B): 
     $attrs.$observe('type', function(value) { 
      console.log(value); // <- undefined 
     }); 

     // But.. C): 
     return "This works though {{ book.type }}"; // <- renders 
    } 
}); 

Cả A) và B) biến thể trả về undefined. C) hiển thị chính xác.

Có cách nào để truy cập các thuộc tính trong hàm mẫu trước khi trả về chuỗi mẫu không?

Answer 1

Trong 1.5, templateUrl hiện nhận các loại thuốc tiêm theo tài liệu: https://docs.angularjs.org/guide/component. Nếu bạn sử dụng ng-srict-di bạn sẽ gặp lỗi trừ khi bạn chỉ định các loại thuốc chích .... Tôi đang sử dụng ng-annotate để lưu các cơn đau đầu và giữ mã sạch. Dưới đây là một ví dụ (trong nguyên cảo):

import IRootElementService = angular.IRootElementService; 
    import IAttributes = angular.IAttributes; 

    angular.module('app').component('book', { 

     /*@ngInject*/ 
     templateUrl($element:IRootElementService, $attrs:IAttributes) { 
      // access to the $element or $attrs injectables 
     } 

    }); 

hoặc không có ng-chú thích trong vani JS:

angular.module('app').component('book', {  
     templateUrl: ['$element', '$attrs', function($element, $attrs) { 
      // access to the $element or $attrs injectables 
     }], 
    });