是否有可能从角指令更新父范围与适用范围:真的吗? [英] Is it Possible to Update Parent Scope from Angular Directive with scope: true?

查看:131
本文介绍了是否有可能从角指令更新父范围与适用范围:真的吗?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有必要从在指令一个父控制器继承范围。我并不想离开范围:假的。我也不一定要使用隔离的范围,因为它需要大量的工作让我不关心正确关联,(认为很多价值在父控制器)的数值。

I have a need for inheriting scope from a parent controller in a directive. I don't necessarily want to leave scope: false. I also don't necessarily want to use an isolated scope, because it requires a lot of work to get the values I do care about linked properly (think lots of values in a parent controller).

是否有意义使用范围:真正的在我的指令,如果我想更新父范围

Does it make sense to use scope:true in my directive if I want to update parent scope?

<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>'
    }
})

请查看小提琴

推荐答案

虽然@ user1737909已经提到的SO问题读取(<一个href=\"http://stackoverflow.com/questions/14049480/what-are-the-nuances-of-scope-prototypal-prototypical-inheritance-in-angularjs\">What范围是原型/原型继承的细微差别AngularJS?,这将解释这个问题,并建议不同的方法来解决这个问题),我们通常试图给出答案的SO。

Although @user1737909 already referenced the SO question to read (What are the nuances of scope prototypal / prototypical inheritance in AngularJS?, which will explain the problem and recommended various ways to fix it), we normally try to give the answer on SO.

所以,你拨弄不工作的原因是因为当一个基本类型(例如,字符串,数字或布尔类型)被写入 - 例如, scope.name =了newName - 写永远属于局部范围/对象。换句话说,子范围都有自己的名称的阴影的同名母公司财产一样。解决方法是使用一个对象,而不是一个原始类型,在父范围。那么孩子范围将获得该对象的引用。到对象属性的任何写操作(无论是从父母或子女)将前往一个对象。 (子范围没有得到自己的对象。)

So, the reason your fiddle doesn't work is because when a primitive type (i.e., a string, number, or boolean type) is written to -- e.g., scope.name = newName -- the "write" always goes to the local scope/object. In other words, the child scope gets its own name property that shadows the parent property of the same name. The fix is to use an object, rather than a primitive type, in the parent scope. The child scope will then get a reference to that object. Any writes to the object properties (whether from the parent or the child) will go to that one object. (The child scope does not get its own object.)

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

然后在您的指令:

Then in your directive:

scope.obj.name = newName;

和HTML:

Hello, {{obj.name}}!

<大骨节病> 小提琴

这篇关于是否有可能从角指令更新父范围与适用范围:真的吗?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆