Cập nhật biến phạm vi cha trong AngularJS

Tôi có hai bộ điều khiển, một bộ điều khiển được bọc trong một bộ điều khiển khác. Bây giờ tôi biết phạm vi con kế thừa thuộc tính từ phạm vi cha nhưng có cách nào để cập nhật biến phạm vi mẹ không? Cho đến nay tôi vẫn chưa tìm ra giải pháp rõ ràng nào.

Trong tình huống của tôi, tôi có bộ điều khiển lịch trong một biểu mẫu. Tôi muốn cập nhật ngày bắt đầu và ngày kết thúc từ phạm vi chính (là biểu mẫu) để biểu mẫu có ngày bắt đầu và ngày kết thúc khi được gửi.

Bạn cần sử dụng một đối tượng (không phải đối tượng nguyên thủy) trong phạm vi cha và sau đó bạn sẽ có thể cập nhật nó trực tiếp từ phạm vi con

Cha mẹ:

app.controller('ctrlParent',function($scope){
    $scope.parentprimitive = "someprimitive";
    $scope.parentobj = {};
    $scope.parentobj.parentproperty = "someproperty";
});

Đứa trẻ:

app.controller('ctrlChild',function($scope){
    $scope.parentprimitive = "this will NOT modify the parent"; //new child scope variable
    $scope.parentobj.parentproperty = "this WILL modify the parent";
});

Bản demo làm việc : http://jsfiddle.net/sh0ber/xxNxj/

Xem Các sắc thái của kế thừa nguyên mẫu / nguyên mẫu phạm vi trong AngularJS là gì?

Có một cách nữa để thực hiện tác vụ này và không sử dụng $scope.$parentbiến.

Chỉ cần chuẩn bị một phương thức để thay đổi giá trị trong phạm vi chính và sử dụng nó trong phạm vi con. Như thế này:

app.controller('ctrlParent',function($scope) {
  $scope.simpleValue = 'x';
  $scope.changeSimpleValue = function(newVal) {
    $scope.simpleValue = newVal;
  };
});

app.controller('ctrlChild',function($scope){
    $scope.changeSimpleValue('y');
});

Nó cũng hoạt động và cung cấp cho bạn nhiều quyền kiểm soát hơn đối với các thay đổi giá trị.

Sau đó bạn cũng có thể gọi phương thức ngay cả trong HTML như: <a ng-click="changeSimpleValue('y')" href="#">click me!</a>.

Điều này cũng hoạt động (nhưng không chắc liệu điều này có tuân theo phương pháp hay nhất hay không)

app.controller('ctrlParent',function($scope) {
    $scope.simpleValue = 'x';
});

app.controller('ctrlChild',function($scope){
    $scope.$parent.simpleValue = 'y';
});

Khi bạn gán một thuộc tính nguyên thủy cho một phạm vi, nó luôn là cục bộ cho phạm vi (có thể được tạo nhanh chóng), ngay cả khi một phạm vi cha có một thuộc tính trùng tên. Đây là một quyết định thiết kế, và một IMHO tốt.

Nếu bạn cần thay đổi một số nguyên thủy (ints, boolean, string) trong phạm vi chính, từ dạng xem, bạn cần nó là một thuộc tính của một đối tượng khác trong phạm vi đó, vì vậy phép gán có thể đọc:

<a ng-click="viewData.myAttr = 4">Click me!</a>

và đến lượt nó sẽ:

1. lấy viewDatađối tượng từ bất kỳ phạm vi nào mà nó được xác định trong
2. gán 4 cho myAttrthuộc tính của nó .

Để truy cập các biến được khai báo trong tệp cha, chúng ta nên sử dụng $ cha trong bộ điều khiển con hoặc tệp mẫu

Trong bộ điều khiển

$scope.$parent.varaiable_name

Trong mẫu html

ng-model="$parent.varaiable_name"