Javascript 以编程方式将DOM元素绑定到$scope

假设我有这样的东西：

<div ng-app="myApp">
    <div ng-controller="myCtrl">
        {{foo}}
        <button ng-click="bindToMe" />
    </div>
    <div ng-controller="anotherCtrl">
        {{foo}}
        <button ng-click="noBindToMeInstead" />
    </div>
</div>

<!-- yes its outside of ng-app -->
<div id="tempZone">
    <input type="text" ng-model="foo" />
</div>

---

我希望这样做，这样我就可以编写一个模态窗口服务，允许加载的模板与调用模态的作用域进行交互。到目前为止，我还没有看到这样的例子。是否可以将dom元素绑定到作用域

我将使用一个控制器和作用域，用于您的公共

tempZone

，使用一个数据共享服务（用于输入），并从一个控制器发出$emit“bindToMe”事件，以通知另一个控制器停止侦听更改

类似于

<div ng-app="myApp">
    <div ng-controller="myCtrl">
        {{foo}}
        <button ng-click="bindToMe()" />
    </div>
    <div ng-controller="anotherCtrl">
        {{foo}}
        <button ng-click="bindToMe()" />
    </div>

<!-- no its not outside of ng-app -->
    <div id="tempZone" ng-controller="tempZoneCtrl">
        <input type="text" ng-model="myService.foo" />
    </div>
</div>

您的模式将独立于绑定值的任何其他控制器，它只依赖于单例服务（事实上，它是数据传递的正确工具）

---

另外，您还需要检查AngularUI的$dialog提供程序（）。他们正在重写twitter引导javascript，使其具有角度友好性。

显然，答案非常简单

 $scope.$MAGICBINDMETHOD(tempZone);

只是

 $compile(tempZone)($scope); 

---

完成了。

很抱歉增加了复杂性。但我不一定知道我正在关注的变量的名称。我试图创建一个可以绑定到任何范围并使用任何模板的通用服务+谢谢你的帮助。

 $scope.$MAGICBINDMETHOD(tempZone);

 $compile(tempZone)($scope);