角→渲染和克隆元素->访问范围

Angular -> rendered and cloned element -> scope access

本文关键字:范围 访问 元素      更新时间:2023-09-26

我需要能够在渲染和克隆元素的范围内更改变量和使用方法。如何做到这一点?这里是jsfiddle: http://jsfiddle.net/kashesandr/1pwzm1jb/2/

模板:

<div ng-controller="MyCtrl" class="name">
  Hello, {{name}}!
</div>
代码:

var myApp = angular.module('myApp',[]);
function MyCtrl($scope) {
    $scope.name = 'Superhero';
    $scope.setName = function(name){
        $scope.name = name;
    };
}
function update() {
    var element = document.querySelector('.name')
    var scope = angular.element(element).scope()
    var copy = element.cloneNode(true)
    document.body.appendChild(copy);
    var names = document.querySelectorAll('.name');
    console.log(names);
    var element1 = names[0];
    var scope1 = angular.element(element1).scope();
    scope1.$apply(function(){
        scope1.setName(123);
    });
    var element2 = names[1];
    var scope2 = angular.element(element2).scope();
    scope2.$apply(function(){
        scope2.setName(234); // this must work
    });

}   
setTimeout(update, 1500);

谢谢!

不幸的是,如果按照你所说的去做,在Angular中是不允许的。不允许克隆或复制窗口或作用域对象。这意味着您不能复制<div class="name">{{name}}</div>,将副本附加到主体,修改它,然后运行$digest循环。这将导致无限循环/循环引用。

有关ng:cpws的详细信息请参阅此链接

https://docs.angularjs.org/error/ng/cpws

如果你可以访问源代码(我认为你可以),你应该尝试更新angular应用,而不是试图从外部修改它。您在这里描述的内容很容易在应用程序范围内完成。