angularjs – 是否可能从角度更新父作用域范围:范围:true?

我需要在指令中从父控制器继承范围。我不一定要离开范围:假。我也不一定要使用一个孤立的范围,因为它需要大量的工作来获得我关心的链接正确的值(认为在父控制器中的许多值)。

如果我想更新父作用域,在我的指令中使用scope:true是有意义的吗?

<div ng-controller="MyCtrl">
      Hello, {{name}}!
        <my-directive></my-directive>
</div>
var myApp = angular.module('myApp',[]);

//myApp.directive('myDirective', function() {});
//myApp.factory('myService', function() {});

function MyCtrl($scope) {
    $scope.name = 'Dave';
}


myApp.directive('myDirective', function() {
    return {
        scope: true,
        restrict: 'EA',
        link: function(scope, elem, attrs) {
            scope.updateName = function(newName) {
                console.log('newName is: ' + newName);
                scope.name = newName;
            }
        },
        template: '<input ng-model="updatedName" placeholder="new name value"> <button ng-click="updateName(updatedName)">Update</button>'
    }
})

请查看fiddle

虽然@ user1737909已经引用了SO问题( What are the nuances of scope prototypal / prototypical inheritance in AngularJS?,这将解释问题,并建议各种方法来解决它),我们通常尝试给出答案SO。

所以,你的小提琴不工作的原因是因为当一个原始类型(即,字符串,数字或布尔类型)被写入 – 例如,scope.name = newName – “写”总是去局部作用域/对象。换句话说,子范围获得它自己的name属性,其阴影同名的父属性。修复是在父作用域中使用对象,而不是基本类型。然后,子范围将获得对该对象的引用。对对象属性(无论是从父对象还是子对象)的任何写入都将转到该对象。 (子作用域没有获取其自己的对象。)

$scope.obj = {name: 'Dave'};

然后在你的指令:

scope.obj.name = newName;

和HTML:

Hello, {{obj.name}}!

fiddle

相关文章
相关标签/搜索