AngularJSバインド$スコープ変数

Question

私はangularJSでこのディレクティブを構築しよう、と私はその名の例以下

angular.module('ng.box', codeHive.angular.modules) 
.directive('boxView', function($compile) { 
return { 
    link: function(scope, element, attrs, ngModelCtrl) { 
     var name = 'exampl'; 
     var htmlTemplate = '<div instance="'+scope[name].innerVal +'" </div> '; 

     var el = angular.element('<div/>'); 
     el.append(htmlTemplate); 
     $compile(el)(scope); 
     element.append(el); 
    }, 
    }; 
}) 

のように別の変数から来HTML、オブジェクトのプロパティにバインドしようとするこの問題 に直面私は、HTML要素にインスタンス属性へのこのオブジェクトのプロパティをバインドする方法を理解しようとし

var htmlTemplate = '<div instance="'+scope[name].innerVal +'" </div> '; 

すべてのヘルプ

Answer 1

はかなりシンプルください：

var htmlTemplate = '<div instance="' + name + '.innerVal" </div> '; 

PS。ところで、これらの行は、スワップする必要があります。

element.append(el); // this should be first line 
    $compile(el)(scope); // this should be second line 

理由は、親要素の他のディレクティブを必要とテンプレートが追加されているのディレクティブは、「オフライン」コンパイルしたときにそれらを見つけることができないということです。