Tuyên bố đối tượng phức tạp trong cách ly phạm vi

Question

tôi có thể tạo một chỉ thị dateRangePicker mà tôi tuyên bố như thế này:

<date-range-picker start="schedule.start" end="schedule.end"></date-range-picker> 

chỉ thị của tôi được khai báo như sau:

.directive("dateRangePicker", function() { 
     return { 
      restrict: 'E', 
      require: '^form', 
      scope: { 
        start: '=', 
        end: '=' 
      }, 
      replace: true, 
      templateUrl: 'dateRangePicker.tpl.html', 
      link: function (scope, elm, attrs, ctrl) { 

Vấn đề là mẫu của tôi: dateRangePicker.tpl.html khởi tạo một phạm vi con (thành phần DatePicker của angular-ui thực hiện nó thông qua bộ điều khiển tương ứng của nó), do đó, bất kỳ nỗ lực nào để viết các giá trị cho scope.start hoặc scope.end sẽ không ảnh hưởng đến phạm vi chỉ thị.

Tôi muốn khai báo phạm vi bị cô lập của mình, để xung đột không xảy ra:
scope.schedule.start và scope.schedule.end.

tôi đã cố gắng để làm điều này:

return { 
      restrict: 'E', 
      require: '^form', 
      scope: { 
       schedule: { 
        start: '=start', 
        end: '=end' 
       } 
      } 

Nhưng lỗi này xảy ra:
Error: 'undefined' is not a function (evaluating 'definition.match(LOCAL_REGEXP)')

Có cách nào để đạt được nó sử dụng phạm vi bị cô lập?

Tôi chỉ không muốn truyền bá phạm vi thông qua scope:false (hoạt động, tôi đã thử nghiệm nó) để giữ được đóng gói tốt.

Answer 1

Bạn có thể chuyển đối tượng phức tạp đến phạm vi nhưng không sử dụng cú pháp bạn đã sử dụng. phạm vi cha mẹ của bạn nên có đối tượng đúng tiến độ và sau đó trong html bạn có thể làm

<date-range-picker schedule="schedule"></date-range-picker> 

Bây giờ bạn có thể sử dụng nó trong phạm vi cô lập bằng cách sử dụng cú pháp quen thuộc

scope :{ 
    schedule:'=' 
}