cách chuyển $ scope tới angularjs 1.5 thành phần/chỉ thị

Question

Tôi đang cố gắng sử dụng phương thức .component() mới trong góc 1.5. Hiện tại tôi đã tìm thấy ít thông tin về cách sử dụng nó. Các tài liệu góc không đề cập đến nó thực sự hoặc.

Tôi đang cố chuyển phạm vi hoặc đối tượng từ phạm vi đến .component được sử dụng trong phần mẫu của thành phần nhưng chỉ có hai thông số tôi có thể vượt qua là $ element và $ attrs. Tôi đã cố gắng vượt qua đối tượng thông qua một thuộc tính trong html nhưng tất cả tôi nhận được là chuỗi của tên đối tượng.

Tôi đã cố gắng thiết lập nó để được biểu diễn dưới dạng một biến theo những cách

my-attr="item.myVal" 
my-attr="{item.myVal}" 
my-attr="{{item.myVal}}" 

mỗi khi tôi vẫn nhận được chuỗi chữ và không phải là giá trị của biến. Làm thế nào tôi có thể đặt nó để được coi là một biến?

Tôi đã thử chụp dữ liệu qua các kết buộc mới: {} nhưng mẫu của tôi: {} không có quyền truy cập vào các biến đó.

Đây là thành phần của tôi như bây giờ:

export var ItemListAction = { 
    controller: 'PanelCtrl as itemCtrl', 
    isolate: false, 
    template: ($element: any, $attrs: any): any=> { 
     var myVal: any = $attrs.myAttr; // returns "item.myVal" 
     var listAction: string = compileListAction(); 
     return listAction; 
    } 
}; 

Đây là thành phần của tôi trong HTML

<panel-item-list-action my-attr="item.myVal"></panel-item-list-action> 

Đây là tuyên bố mô-đun góc cho thành phần: angular.module('Panel', []).component('panelItemListAction', ItemListAction)

Answer 1

Templates don không cần phạm vi $. Các hàm mẫu trả về HTML. Bạn có thể tiêm $ scope trong controller như mọi khi.

Đây là những gì AngularJS Blog nói về thành phần:

module.component

Chúng tôi đã tạo ra một cách đơn giản hơn về đăng ký chỉ thị phần. Về bản chất, các thành phần là các loại chỉ thị đặc biệt, được ràng buộc với một phần tử tùy chỉnh (giống như <my-widget></my-widget>), với một mẫu được liên kết và một số ràng buộc. Bây giờ, bằng cách sử dụng phương pháp .component() trong AngularJS 1.5, bạn có thể tạo một thành phần tái sử dụng với rất ít dòng mã:

var myApp = angular.module("MyApplication", []) 
myApp.component("my-widget", { 
    templateUrl: "my-widget.html", 
    controller: "MyWidgetController", 
    bindings: { 
    title: "=" 
    } 
}); 

Để tìm hiểu thêm về phương pháp thành phần AngularJS 1,5 xin vui lòng đọc Todd bài viết Phương châm của: http://toddmotto.com/exploring-the-angular-1-5-component-method/

- http://angularjs.blogspot.com/2015/11/angularjs-15-beta2-and-14-releases.html