Angular pass dynamic scope to directive <p>I have a directive that takes an attribute value from a an http call like so:</p> <p>Controller</p> <pre><code>app.controller("HomeController", function($scope){ $http.get("/api/source").then(function(res){ $scope.info = res.data }); }); </code></pre> <p>HTML</p> <pre><code>&lt;div ng-controller="MainController"&gt; &lt;ng-mydirective data-info="{{info}}"&gt;&lt;/ng-mydirective&gt; &lt;/div&gt; </code></pre> <p>Directive:</p> <pre><code>app.directive("ngMydirective", function(){ return { restrict: "E", templateUrl: "/partials/info.html", link: function(scope, element, attrs){ scope.info = attrs.info; } } }); </code></pre> <p>I'm trying to pass that info variable from the controller, into the directive, through an attribute. It doesn't work because the variable value is initially created from an asynchronous http call, so at the time the directive is created, there is no value.</p> <p>Is there a way to do this?</p>