javascript - Why does using ng-repeat for my directive make a difference to my binding? -

if take code:

    <div data-ng-repeat="video in vm.videos">         <p>{{video.title}}</p>         <video-item content="video"></video-item>     </div> 

it appears render directive correctly (the video object bound correctly , accessible directive).

however if want display single video (same object type, single object rather collection):

    <p>{{vm.currentvideo.title}}</p>     <div data-video-item content="vm.currentvideo"></div> 

then why scope no longer have access binding?

here directive:

import models = rod.domain.models;  export class videodirective implements ng.idirective {     public restrict: string = "a";     public replace: boolean = true;     public scope: = {         content: "="     };      constructor(         private $compile: ng.icompileservice,         private templateselector: rod.features.video.templates.itemplateselector<models.ivideo>) {     }      public link: = ($scope: ivideoscope, element: jquery) => {         const video: domain.models.ivideo = $scope.content;         const template: string = this.templateselector.buildtemplate(video);          element.html(template);         this.$compile(element.contents())($scope);     }; 

thanks in advance!

this because link function being called before data had been bound. link function gets called after template has loaded, therefore soon. got around using ng-if around html block check if value set.