Angularjs 指令模型绑定不'；不能在angular ui引导选项卡指令下工作_Angularjs_Angularjs Directive_Angular Ui

Angularjs 指令模型绑定不'；不能在angular ui引导选项卡指令下工作

angularjs

Angularjs 指令模型绑定不'；不能在angular ui引导选项卡指令下工作,angularjs,angularjs-directive,angular-ui,Angularjs,Angularjs Directive,Angular Ui,我在Angular.js中有一个模型，它可以从控制器和指令中更新。如果我将该指令放在AngularUI引导选项卡指令中，它不会更新模型。代码非常简单，应该可以工作请选择第二个选项卡，然后单击按钮。它不会更新它：这里有一个小插曲：更改CTRL[23,67] 这应该在任何按钮的内部：{{ranges} 静态内容 AngularUI boostrap指令创建了一个子范围，因此快速修复方法是在“第二个”选项卡中使用以下内容：谢谢你，马克！你救了我一整天。如果你计划从应用程序中的多个

我在Angular.js中有一个模型，它可以从控制器和指令中更新。如果我将该指令放在AngularUI引导选项卡指令中，它不会更新模型。代码非常简单，应该可以工作

请选择第二个选项卡，然后单击按钮。它不会更新它：这里有一个小插曲：


更改CTRL[23,67]


这应该在任何按钮的内部：{{ranges}




静态内容

AngularUI boostrap指令创建了一个子范围，因此快速修复方法是在“第二个”选项卡中使用以下内容：

谢谢你，马克！你救了我一整天。如果你计划从应用程序中的多个位置访问模型，我建议创建一个共享服务来存储模型。以下是一个相关的答案：

<!doctype html>
<html ng-app="plunker">
  <head>
    <scriptsrc="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.5/angular.js"></script>
    <script src="http://angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.4.0.js"></script>
    <script src="example.js"></script>
    <link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap-combined.min.css" rel="stylesheet">
  </head>

  <body>
    <div ng-controller="TabsDemoCtrl">  
      <button ng-click="ranges=[23, 67]">Change in CTRL [23, 67]</button>
      <br/>
         This should be inside from any button: {{ranges}}
      <br/>
      <br/>
      <tabset>
         <tab heading="First">Static content</tab>
         <tab heading="Second">
           <my-directive ng-model="ranges"></my-directive>
         </tab>
      </tabset>
    <br/>
    <br/>
    <my-directive ng-model="ranges"></my-directive>
    </div>
  </body>
</html>

<my-directive ng-model="$parent.ranges"></my-directive>