AngularJS:父范围未在指令(具有隔离范围)中以两种方式绑定更新

数据库

我有一个带有隔离范围的指令,该指令的值具有通过两种方式绑定到父范围的值。我正在调用一个方法来更改父作用域中的值,但是更改未应用到我的指令中。(不触发双向绑定)。这个问题非常相似:

AngularJS:父范围未在指令中更新(具有隔离范围)双向绑定

但是我不是从指令中更改值,而是仅在父范围中更改它。我阅读了解决方案,并指出了第五点:

The watch() created by the isolated scope checks whether it's value for the bi-directional binding is in sync with the parent's value. If it isn't  the parent's value is copied to the isolated scope.

这意味着当我的父值更改为2时,将触发监视。它检查父值和指令值是否相同-如果不相同,它将复制到指令值。好的,但是我的指令值仍然是1 ...我缺少什么?

html:

<div data-ng-app="testApp">
    <div data-ng-controller="testCtrl">
        <strong>{{myValue}}</strong>
        <span data-test-directive data-parent-item="myValue" 
            data-parent-update="update()"></span>
    </div>
</div>

js:

var testApp = angular.module('testApp', []);

testApp.directive('testDirective', function ($timeout) {
    return {
        scope: {
            key: '=parentItem',
            parentUpdate: '&'
        },
        replace: true,
        template:
            '<button data-ng-click="lock()">Lock</button>' +
            '</div>',
        controller: function ($scope, $element, $attrs) {
            $scope.lock = function () {
                console.log('directive :', $scope.key);

                 $scope.parentUpdate();
                 //$timeout($scope.parentUpdate); // would work.

                 // expecting the value to be 2, but it is 1
                 console.log('directive :', $scope.key);
            };
        }
    };
});

testApp.controller('testCtrl', function ($scope) {
    $scope.myValue = '1';
    $scope.update = function () {
        // Expecting local variable k, or $scope.pkey to have been
        // updated by calls in the directive's scope.
        console.log('CTRL:', $scope.myValue);
        $scope.myValue = "2";
        console.log('CTRL:', $scope.myValue);
    };
});

小提琴

知识管理

像在控制器中$scope.$apply()更改后使用$scope.myValue

testApp.controller('testCtrl', function ($scope) {
    $scope.myValue = '1';
    $scope.update = function () {
        // Expecting local variable k, or $scope.pkey to have been
        // updated by calls in the directive's scope.
        console.log('CTRL:', $scope.myValue);
        $scope.myValue = "2";
        $scope.$apply();
        console.log('CTRL:', $scope.myValue);
    };
});

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

带指令和隔离范围的两种方式的数据绑定

来自分类Dev

将ngModel绑定到具有隔离范围的AngularJS指令

来自分类Dev

在angularjs指令中对原始变量的两种方式绑定

来自分类Dev

孤立的范围两种方式绑定在angularjs中不起作用

来自分类Dev

编译动态HTML并从JSON响应中绑定变量-具有隔离范围的指令-AngularJS

来自分类Dev

具有隔离范围的Angularjs TreeView指令

来自分类Dev

指令中具有隔离范围的数据

来自分类Dev

AngularJS指令:更新隔离范围

来自分类Dev

AngularJS:修改带有'= xxx'隔离范围的指令中父范围的模型吗?

来自分类Dev

AngularJS:两种方式将视频的currentTime与指令绑定

来自分类Dev

angularjs指令两种方式绑定不起作用

来自分类Dev

测试angularjs指令(更改隔离范围var后,模板未在测试中更新)

来自分类Dev

测试angularjs指令(更改隔离范围var后,模板未在测试中更新)

来自分类Dev

AngularJS中没有隔离范围的指令范围属性

来自分类Dev

具有隔离范围的表单输入指令的双向绑定

来自分类Dev

具有隔离范围的单元测试AngularJS指令-如何获取对输出的绑定?

来自分类Dev

具有隔离范围的单元测试AngularJS指令-如何获取对输出的绑定?

来自分类Dev

具有两种方式绑定的angular-js可重用指令

来自分类Dev

使用angularjs中的可选&符号绑定来隔离范围指令?

来自分类Dev

指令链接函数 angularjs 中的两种方式数据绑定不起作用

来自分类Dev

AngularJS指令-隔离范围的特殊绑定字符

来自分类Dev

隔离范围的angularJS指令,属性绑定无效

来自分类Dev

AngularJS指令-隔离范围的特殊绑定字符

来自分类Dev

具有隔离范围的AngularJS指令-默认属性值

来自分类Dev

具有隔离范围的Angularjs指令需要澄清

来自分类Dev

AngularJS:具有ng-repeat和隔离范围的指令

来自分类Dev

具有隔离范围的AngularJS指令-默认属性值

来自分类Dev

AngularJS:从指令更新父范围

来自分类Dev

如何将对象从具有隔离范围的嵌套指令传递到angular中的父控制器范围

Related 相关文章

  1. 1

    带指令和隔离范围的两种方式的数据绑定

  2. 2

    将ngModel绑定到具有隔离范围的AngularJS指令

  3. 3

    在angularjs指令中对原始变量的两种方式绑定

  4. 4

    孤立的范围两种方式绑定在angularjs中不起作用

  5. 5

    编译动态HTML并从JSON响应中绑定变量-具有隔离范围的指令-AngularJS

  6. 6

    具有隔离范围的Angularjs TreeView指令

  7. 7

    指令中具有隔离范围的数据

  8. 8

    AngularJS指令:更新隔离范围

  9. 9

    AngularJS:修改带有'= xxx'隔离范围的指令中父范围的模型吗?

  10. 10

    AngularJS:两种方式将视频的currentTime与指令绑定

  11. 11

    angularjs指令两种方式绑定不起作用

  12. 12

    测试angularjs指令(更改隔离范围var后,模板未在测试中更新)

  13. 13

    测试angularjs指令(更改隔离范围var后,模板未在测试中更新)

  14. 14

    AngularJS中没有隔离范围的指令范围属性

  15. 15

    具有隔离范围的表单输入指令的双向绑定

  16. 16

    具有隔离范围的单元测试AngularJS指令-如何获取对输出的绑定?

  17. 17

    具有隔离范围的单元测试AngularJS指令-如何获取对输出的绑定?

  18. 18

    具有两种方式绑定的angular-js可重用指令

  19. 19

    使用angularjs中的可选&符号绑定来隔离范围指令?

  20. 20

    指令链接函数 angularjs 中的两种方式数据绑定不起作用

  21. 21

    AngularJS指令-隔离范围的特殊绑定字符

  22. 22

    隔离范围的angularJS指令,属性绑定无效

  23. 23

    AngularJS指令-隔离范围的特殊绑定字符

  24. 24

    具有隔离范围的AngularJS指令-默认属性值

  25. 25

    具有隔离范围的Angularjs指令需要澄清

  26. 26

    AngularJS:具有ng-repeat和隔离范围的指令

  27. 27

    具有隔离范围的AngularJS指令-默认属性值

  28. 28

    AngularJS:从指令更新父范围

  29. 29

    如何将对象从具有隔离范围的嵌套指令传递到angular中的父控制器范围

热门标签

归档