angularjs-directive - 在 html 字符串中编译后未定义的角度对象传递给另一个指令

Question

我在 Angular 中做这样的事情。
编译后，对象将无法正确传递给 DirectiveB。
但是，如果我传递了作用域中定义的对象，那就没问题了。
我想知道为什么会发生这种情况以及如何以简单的方式将对象（不在范围内）传递给带有已编译 html 字符串的指令？我使用闭包来做到这一点，但它不容易维护。

在 DirectiveA.js 中：

.directive('DirectiveA', function($compile, $parse) {
    return
    ...
    link: function(scope, element, attrs) {

        function func_be_called_somewhere (...) {

            var obj= {"key":"value"};   //obj is not in scope, I create it here

            var el = '<DirectiveB para="obj" ...>';
            var content = $compile(el)(scope);  //compiled here
            element.append(content);
        }
    }
}

在 DirectiveB.js 中：

.directive('DirectiveB', function($compile, $rootScope, $parse) {
    ...
    scope: {
        ...
        para: '='
        ...
    }
    link: function(scope, element, attr) {
        console.log(scope.para); //undefined
    }
}

JS BIN： http: //jsbin.com/depohoqofi/edit ?html,js,console,output

Answer 1

我认为你应该把你的 obj 放在你的范围内：

scope.obj= {"key":"value"};   //obj is not in scope, I create it here
var el = '<DirectiveB para="scope.obj" ...>';
var content = $compile(el)(scope);  //compiled here
element.append(content);