Angularjsで複数のtranscludeコンポーネントを使用すると奇妙な動作が発生する1.6.1

Question

Angularjsで複数のtranscludeコンポーネントを使用すると、最初のスロットモデルの変更がコントローラに表示されないという奇妙な動作が発生しました。

今

<div ng-app="myApp" ng-controller="testController"> 

<script type="text/ng-template" id="component-template.html"> 
<div style="color:red;" ng-transclude="heading"> 
</div> 
<div style="color:blue;" ng-transclude="body"> 
</div> 
</script> 

Example1 
<input ng-model="example1Model"/> 

<test-component> 
    <panel-heading> 
     Example2 
     <input ng-model="example2Model"/> 
    </panel-heading> 
    <panel-body> 
    Example1Result:{{example1Model}}<br/> 
    Example2Result:{{example2Model}} 
    </panel-body> 
</test-component> 
</div> 

<script> 
angular.module("myApp", []) 
.controller("testController", function ($scope, $location) { 

}) 
.component("testComponent", { 
    templateUrl: "component-template.html", 
    transclude: { 
     heading: "panelHeading", 
     body: "panelBody" 
    }, 
    controller: function ($scope, $element, $attrs) {   
     this.$doCheck = function() { 

      //do anything 
     } 
    } 
}); 
</script> 

あなたはこのJSfiddleでそれをテストしようとした場合：https://jsfiddle.net/Lpveophe/1/

結合モデルexample2Modelは働いていなかったのはなぜ？ ただし、example1Modelバインディングモデルが正しく機能しています。

Answer 1

.をng-modelに設定する必要があります。よりよい範囲を理解するために、この記事をご覧ください：https://github.com/angular/angular.js/wiki/Understanding-Scopes

、それを動作させるどこでもo.example2Modelとexample2Modelを交換し、あなたにcontrollerを変更するには：それは作品

.controller("testController", function ($scope, $location) { 
    $scope.o = {}; 
    $scope.o.example2Model = ''; 
})